D3 交互

xiaoxiao2021-02-28 42

<html> <body> <script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script> <script> var width = 300; //画布的宽度 var height = 300; //画布的高度 var svg = d3.select("body") //选择文档中的body元素 .append("svg") //添加一个svg元素 .attr("width", width) //设定宽度 .attr("height", height); //设定高度 var rect = svg.append("rect") //添加一个矩形 .attr("x",50) .attr("y",50) .attr("width",50) .attr("height",50) .attr("fill","red") .on("mouseover",function(){ d3.select(this) //this传入的当前的元素标签，这个在处理一组元素的时候很有用 .attr("fill","yellow");}) .on("mouseout",function(){ d3.select(this) .attr("fill","blue");}); </script> </body> </html>

转载请注明原文地址: https://www.6miu.com/read-2629190.html

技术

最新回复(0)