首页 > Web开发 > 详细

d3.js学习1

时间:2015-01-09 00:02:14      阅读:466      评论:0      收藏:0      [点我收藏+]

官网:


http://d3js.org/

范例:


 

https://github.com/mbostock/d3/wiki/Gallery

引用:


 

//在线引用
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
//或下载到本地
<head>
	<meta charset="utf-8">
	<title>D3.js galance</title>
	<script src="d3.min.js"></script>
</head>

开始:


<body>
    <p id=‘target‘></p>
    <script type="text/javascript">
        d3.select("p#target").text("Hello World!");
    </script>
</body>    

d3.select实现单个元素选取

select.attr,读取/设置元素属性


 

<p id=‘target‘></p>
<script type="text/javascript">
	var res=d3.select("p#target").attr("id");
	document.write(res);
</script>
//结果为target
<p></p>
<script type="text/javascript">
	d3.select("p").attr("id","p1");
	var res=d3.select("p").attr("id");
	document.write(res);
</script>
//将p的id设为p1,并输出p的id

select.classed,添加/删除元素类


<p class="p1"></p>
<script type="text/javascript">
	var res=d3.select("p").classed("p1");
	document.write(res);
</script>
//检测该元素是否属于p1类,返回布尔值
<p></p>
<script type="text/javascript">
	var res=d3.select("p").classed("p1",true);
</script>
//为P标签添加p1这个类
<p class="p1"></p>
<script type="text/javascript">
	d3.select("p").classed("p1",function(){return false;});
	var res=d3.select("p").classed("p1");
	document.write(res);
</script>
//为P标签移除p1这个类

  

 

d3.js学习1

原文:http://www.cnblogs.com/valentineisme/p/4212028.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!