Echarts基础(二)柱、饼、折线图

常见图制作

柱状图与折线图使用横坐标轴设置类目，series里设置对应数据，其type分别为‘bar'和’line‘，这里面柱状图的data对应于每个柱子的高度，而折线图的数据则为连成线的多个点，若为多线图，则需要多组对应的name，type与data。

饼图没有横纵坐标的设置，其data多为[{value:12,name:test1},{value:34,name:test2}]的样式，这里要注意饼图的type为‘pie’，若在下面添加roseType:'radius"则饼图变为玫瑰图，这里面常需要设置center:[50%,50%], radius:'60%'。这个radius是指饼图占有所在区域的比例，若将其改为radius:[50%, 70%]，则饼图变为环状图。

tooltip：设置其触发方式有两种，一种是坐标轴触发即type:Axis，另一种是数据触发则为type:item，还可设置formatter:"{a}<br/>{b}:{c}({d}%)",其中a为数据名，b为类目名，c为对应类目的数据，d为百分比（饼图）。

legend：他是每个图的图例，可为其设置位置如x：left，还可为其设置竖直／水平方向orient:'vertical'或者orient:'horizontal'，然后设置data:[],  即显示的图例文字。

grid：它是直角坐标系内的绘图网格，可以设定其左上，右下两点的坐标值，其中有属性经常用到containLabel:true,包含标签在网格中。

xAxis,yAxis：坐标轴有两种类型，类目型和数值型，其中x轴通常为类目型 (type : 'category')，y轴为数值型( type : 'value')，还可以为其设置name，name的位置以及分割线等。

itemstyle：可设定为两种，一种是normal样式，另一种为emphasis样式，即鼠标悬浮的样式，可在其中具体设置颜色等属性。