Devtantra Blog

Tutorials about Android, Angular, ReactJS, PHP, MySQL and Web Development

Generate Your Visualized Data

You know that if are visualized  your data in html then you use some specific CSS code and these are width/height  for different -different part of your data, but you have visualized your data without css ? that is possible by using D3.js . D3.js is java-script library that uses digital data to drive the creation and control of dynamic and interactive graphical forms which run in web browsers. Here d3 means just for data-driven documents.

d3.js tut by devtantra

To create chart i am use mydata.json file and for connecting to file i am use the d3.json . where .json show the file extension . if you can use csv file then use d3.csv function .

 Index.html

<script charset="utf-8" type="text/javascript" src="http://d3js.org/d3.v3.min.js"></script>
<script type="text/javascript">
//<
![CDATA[
d3.json("mydata.json",function(data){ 
var canavas = d3.select("body")
.append("svg") 
.attr("width",500) 
.attr("height",500) canvas.selectAll("rect") .data(data) .enter() .append("rect") .attr("width",function (d){
return d.age * 10; }) 
.attr("height",50) 
.attr("y",function (d) {return i * 50;}) 
.attr("fill","blue") })
// ]]>
</script>

mydata.json

[
{"name":"AJAY","age": 20},
{"name":"Meenaxi","age": 25},
{"name":"Aashish","age": 27},
]
Summary
Generate Your Visualized Data
Article Name
Generate Your Visualized Data
Description
You know that if are visualized your data in html then you use some specific CSS code and these are width/height for different -different part of your data, but you have visualized your data without css ? that is possible by using D3.js . D3.js is java-script library that uses digital data to drive the creation and control of dynamic and interactive graphical forms which run in web browsers. Here d3 means just for data-driven documents.
Author
0
0

6 thoughts on “Generate Your Visualized Data

  1. I see a lot of interesting posts on your website. You have to
    spend a lot of time writing, i know how to save you a lot of time, there is a tool that creates unique, google friendly articles in couple of minutes, just search in google – laranita’s free content source

    0

    0

Leave a Reply

%d bloggers like this: