Monday, 24 March 2014

D3 video 3

Adding style elements - using CSS

style method
.style
two arguements

so to turn a paragraph red:
d3.select("body)
 .apend("p")
 .style("color", "red")
 .text("hi");

</script>

CREATE SVG shapes

use the .attr method

Create a container on the web page first
d3.select("body")
.append("svg")
.attr("width", 500)
.attr("height", 500);

worth creating a variable - GOOD practice

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

make a circle

var circle = canvas.append("circle")
      .attr("cx", 250)  - cx gives a position
      .attr("cy", 250) - cy gives a position
      .attr("r", 50) - r is radius
      .attr("fill", "red") - gives a color to the circle. 



This is useful and I think I need to give it a go somewhere.

Where can I try my d3 script?????

Local file will work!!!




No comments:

Post a Comment