首页 > 代码库 > d3.js学习6

d3.js学习6

加载server数据d3.json(url,callback)


 

首先准备一些json数据,将上一篇的js数据转化为json格式并存储

var data=http://www.mamicode.com/["Retail"},	{expense:15,category:"Gas"},	{expense:30,category:"Retail"},	{expense:50,category:"Dining"},	{expense:80,category:"Gas"},	{expense:65,category:"Retail"},	{expense:55,category:"Gas"},	{expense:30,category:"Dining"},	{expense:20,category:"Retail"},	{expense:10,category:"Dining"},	{expense:8,category:"Gas"}];var jsonData=http://www.mamicode.com/JSON.stringify(data);>

输出结果后存储为data.json

var data=http://www.mamicode.com/[];"body")	.selectAll("div.h-bar")	.data(data);	//enter	selection.enter()	.append("div")	.attr("class","h-bar")	.append("span");	//remove	selection.exit().remove();	//update	selection.attr("class","h-bar")	.style("width",function(d){		return (d.expense*5)+"px";	})	.select("span")	.text(function(d){		return d.category;	});}//d3.json(‘url‘,callback)function load(){	d3.json("data.json",function(error,json){	data=http://www.mamicode.com/data.concat(json);>

技术分享

 

d3.js学习6