suranyami/.block

## .block
license: gpl-3.0

## README.md

      
    Raw
  

              README.md
            
          
    Learning D3.js

Experimental area.

  
## index.html
<!DOCTYPE html>
<head>
  <meta charset="utf-8">
  <style>
  body {font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; width: 960px; height: 500px; position: relative;}
  </style>
  <script src="https://d3js.org/d3.v4.min.js"></script>
</head>

<body>
<p>Velit sit commodo consequat irure consequat ut esse veniam ut elit
proident labore est ullamco est.</p>

<p>Officia Lorem ad dolore cillum ipsum adipisicing veniam ad esse aute ad
adipisicing exercitation enim sit. Exercitation velit do
exercitation deserunt pariatur nostrud eu officia sint est commodo
reprehenderit do ipsum.</p>

<p>Aliqua sunt nostrud enim ut non sint nulla eiusmod nostrud anim consequat
tempor qui. Ex reprehenderit ex consectetur elit aliquip proident irure
cupidatat.</p>

<p>Incididunt sint sunt pariatur esse proident elit esse amet dolor dolore sit.
Ea consectetur cillum esse aliqua duis ullamco ex laboris
eiusmod excepteur id pariatur proident incididunt eu consequat magna.</p>

 <script>
  var p = d3.select("body")
    .selectAll("p")
    .data([12, 14, 18, 24, 36])
    .style("font-size", function(d) {return d + "px";})
    .text(function(d) {return d;});

  p.enter().append("p")
    .text(function(d) {return d;});

  p.exit().remove();

  d3.select("body")
    .transition()
    .duration(750)
    .delay(1000)
    .style("background-color", "lightgray");
</script>
	<!DOCTYPE html>
	<head>
	<meta charset="utf-8">
	<style>
	body {font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; width: 960px; height: 500px; position: relative;}
	</style>
	<script src="https://d3js.org/d3.v4.min.js"></script>
	</head>

	<body>
	<p>Velit sit commodo consequat irure consequat ut esse veniam ut elit
	proident labore est ullamco est.</p>

	<p>Officia Lorem ad dolore cillum ipsum adipisicing veniam ad esse aute ad
	adipisicing exercitation enim sit. Exercitation velit do
	exercitation deserunt pariatur nostrud eu officia sint est commodo
	reprehenderit do ipsum.</p>

	<p>Aliqua sunt nostrud enim ut non sint nulla eiusmod nostrud anim consequat
	tempor qui. Ex reprehenderit ex consectetur elit aliquip proident irure
	cupidatat.</p>

	<p>Incididunt sint sunt pariatur esse proident elit esse amet dolor dolore sit.
	Ea consectetur cillum esse aliqua duis ullamco ex laboris
	eiusmod excepteur id pariatur proident incididunt eu consequat magna.</p>

	<script>
	var p = d3.select("body")
	.selectAll("p")
	.data([12, 14, 18, 24, 36])
	.style("font-size", function(d) {return d + "px";})
	.text(function(d) {return d;});

	p.enter().append("p")
	.text(function(d) {return d;});

	p.exit().remove();

	d3.select("body")
	.transition()
	.duration(750)
	.delay(1000)
	.style("background-color", "lightgray");
	</script>