比例尺是用来映射值域(真实值)和画布(svg)之间对应关系的工具。
比例尺分为线性比例尺,d3.scale.linear().domain(array1[]).range(array2[]);
序列比例尺,d3.scale.ordinal().domain(序列值).rangeRoundBands(画布上多范围)。
画布是人看到的区域,而图形图表的大小可能很大或者很小,体现在画布上要么是太大了放不下,太小了分不清。所以需要按比例进行缩放。
比例尺一般结合坐标轴来用。
定义图形时要注意,x轴是从左到右走,y轴从上往下走。具体到比如柱形图,若某一个柱形在y方向上的起点值越小,相对于y方向上的偏移量dy越大,则该柱形越矮。
绘制柱形图的一般步骤:
01.定义画布
02.定义柱形的数组
03.定义x轴比例尺,y轴比例尺,x轴坐标,y轴坐标
04.绘制柱形
05.绘制坐标
06.绘制柱形对应的文字
07.为柱形,坐标,文字添加样式
08.适当的为文字,柱形添加动效