d3
csdn_huangyumin
一直努力下去,看命运还怎么肆虐我
展开
-
用d3.js实现基于SVG的线形图
http://ju.outofmemory.cn/entry/60346step1:引入d3.jsstep2:创建SVG容器var margin = {top: 20, right: 20, bottom: 30, left: 50}, width = document.body.clientWidth - margin.left - margin.ri转载 2015-10-26 16:11:46 · 1180 阅读 · 0 评论 -
CSS和SVG中的剪切——clip-path属性和<clipPath>元素
http://www.w3cplus.com/css3/css-svg-clipping.html转载 2015-10-26 21:14:16 · 434 阅读 · 0 评论 -
stroke-linejoin
stroke-linejoin 可使用的值是:miter, round, bevel, inherit 笔划连 接属性定义了路径拐角的形状,"miter"是默认值,"round"光滑连接,"bevel"折线连接,"inherit"继 承转载 2015-10-26 20:00:27 · 1251 阅读 · 0 评论 -
stroke-linecap
stroke-linecap 可使用的值是: butt, round, square, inherit"笔划端 点"的属性定义了开放笔划(未闭合)的端点的形状,分别是"粗大的"butt,"圆滑的"round,"平整 的"square 和"继承 的"inherit.转载 2015-10-26 20:01:30 · 2707 阅读 · 0 评论 -
D3.js中使用scale
先介绍两个经常和 scale 一起出现的函数,在上一节中也出现了。d3.max()d3.min()它们用于求一个数组中的最大值和最小值,如果是一维数组,使用方法如下:var dataset = [ 30, 20 , 52 , 2 , 11 ]; var result = d3.max( dataset ); 变量 result 中保存的是数组 datase转载 2015-10-26 20:24:39 · 2426 阅读 · 0 评论 -
d3数轴
设定数轴与比例尺相似,D3的数轴实际上也是由你来定义参数的函数。但与比例尺不同的是,调用数轴函数并不会返回值,而是会生成数轴相关的可见元素,包括轴线、标签和刻度。使用d3.svg.axis()可以创建通用的数轴函数:var xAxis = d3.svg.axis();要使用数轴,最起码要告诉它基于什么比例尺工作。在此,我们把绘制散点图时定义的xScale传给它: xAxis转载 2015-10-26 20:40:11 · 671 阅读 · 0 评论 -
使用D3 Geo模块画澳大利亚地图
因此,首先需要澳大利亚的地图数据,D3中的Geo模块可以处理GeoJSON格式的地理数据。(GeoJSON是一种对各种地理数据结构进行编码的格式。GeoJSON对象可以表示几何、特征或者特征集合。GeoJSON支持下面几何类型:点、线、面、多点、多线、多面和几何集合。GeoJSON里的特征包含一个几何对象和其他属性,特征集合表示一系列特征。参见: http://www.oschina.net/tr转载 2015-10-26 20:47:14 · 1408 阅读 · 0 评论 -
SVG DEFS元素、SYMBOL元素和USE元素
SVG DEFS元素SVG的元素用于预定义一个元素使其能够在SVG图像中重复使用。例如你可以将一些图形制作为一个组,并用元素来定义它,然后你就可以在SVG图像中将它当做简单图形来重复使用。看下面的例子:svgxmlns="http://www.w3.org/2000/svg"> defs> g>转载 2015-10-26 21:04:53 · 1298 阅读 · 0 评论