首页 > 代码库 > d3.js学习9
d3.js学习9
d3.js数据可视化实战手册 学习笔记
插值器Interpolation 给定值域,往中间填值并打印出来
字符插值
var data=http://www.mamicode.com/[];"italic bold 12px/30px Georgia, serif", "italic bold 120px/180px Georgia, serif"]);for(var i=0;i<10;i++){ data.push(i);}function render(data,scale,component){ var selector=d3.select(component).selectAll("div.cell").data(data); //enter selector.enter().append("div").classed("cell",true).append("span"); //exit selector.exit().remove(); //update selector.style("display","inline-block") .select("span") .style("font",function(d,i){ return scale(d); }) .text(function(d,i){ return i; });}render(data,sizeScale,"#font")
颜色插值
var data=http://www.mamicode.com/[];"white","#4169e1"]);for(var i=0;i<21;i++){ data.push(i);}function render(data,scale,component){ var selector=d3.select(component).selectAll("div.cell").data(data); //enter selector.enter().append("div").classed("cell",true).append("span"); //exit selector.exit().remove(); //update selector.style("display","inline-block") .style("background-color",function(d,i){ return scale(d); }) .select("span") .text(function(d,i){ return i; });}render(data,colorScale,"#color");
d3.js学习9
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。