laxmikanta415/.block

## .block
license: mit

## README.md

      
    Raw
  

              README.md
            
          
    Built with blockbuilder.org

  
## index.html
<!DOCTYPE html>
<head>
  <meta charset="utf-8">
  <script src="https://d3js.org/d3.v4.min.js"></script>
  <style>
 body {
  margin: 0;
  background: #222;
  min-width: 960px;
}

rect {
  fill: none;
  pointer-events: all;
}

circle {
  fill: none;
  stroke-width: 2.5px;
}
  </style>
</head>

<body>
  <script>
    // Feel free to change or delete any of the code you see in this editor!


var width = Math.max(960, innerWidth),
    height = Math.max(500, innerHeight);

var i = 0;

var svg = d3.select("body").append("svg")
    .attr("width", width)
    .attr("height", height);

svg.append("rect")
    .attr("width", width)
    .attr("height", height);
    var xScale = d3.scaleLinear().range([0,width]);
    var yScale = d3.scaleLinear().range([0,height]);

    setInterval(function(){particle();},200)
function particle() {
  var t = d3.range(Math.random()*200);
  var m = d3.extent(t);
 xScale.domain(m);
  yScale.domain(m);
  svg.insert("circle", "rect")
      .attr("cx", xScale(20))
      .attr("cy", yScale(50))
      .attr("r", 1e-6)
      .style("stroke", d3.hsl((i = (i + 1) % 360), 1, .5))
      .style("stroke-opacity", 1)
    .transition()
      .duration(2000)
      .ease(Math.sqrt)
      .attr("r", 100)
      .style("stroke-opacity", 1e-6)
      .remove();

  //d3.event.preventDefault();
}

  </script>
</body>
	<!DOCTYPE html>
	<head>
	<meta charset="utf-8">
	<script src="https://d3js.org/d3.v4.min.js"></script>
	<style>
	body {
	margin: 0;
	background: #222;
	min-width: 960px;
	}

	rect {
	fill: none;
	pointer-events: all;
	}

	circle {
	fill: none;
	stroke-width: 2.5px;
	}
	</style>
	</head>

	<body>
	<script>
	// Feel free to change or delete any of the code you see in this editor!



	var width = Math.max(960, innerWidth),
	height = Math.max(500, innerHeight);

	var i = 0;

	var svg = d3.select("body").append("svg")
	.attr("width", width)
	.attr("height", height);

	svg.append("rect")
	.attr("width", width)
	.attr("height", height);
	var xScale = d3.scaleLinear().range([0,width]);
	var yScale = d3.scaleLinear().range([0,height]);

	setInterval(function(){particle();},200)
	function particle() {
	var t = d3.range(Math.random()*200);
	var m = d3.extent(t);
	xScale.domain(m);
	yScale.domain(m);
	svg.insert("circle", "rect")
	.attr("cx", xScale(20))
	.attr("cy", yScale(50))
	.attr("r", 1e-6)
	.style("stroke", d3.hsl((i = (i + 1) % 360), 1, .5))
	.style("stroke-opacity", 1)
	.transition()
	.duration(2000)
	.ease(Math.sqrt)
	.attr("r", 100)
	.style("stroke-opacity", 1e-6)
	.remove();

	//d3.event.preventDefault();
	}

	</script>
	</body>