echarts 树图样式美化_ECharts个性化图表样式的实现

Echarts 绘制南丁格尔图

Echarts 可以自定义配置选项；

Echarts 设置数据图形的样式可以从三个层级入手，分别是：全局、系列和数据。

下面我们使用 Echarts 来实现如下的一个南丁格尔图：

开始绘制南丁格尔图

与第一节绘制的图表样式不同，本节我们要绘制的是饼图(第一节是柱状图)。

饼图是根据明显的扇形弧度的不同来表达不同类目的数据占据的总数的百分比。相比于柱状图，饼图的数据格式更加简单，它数值是一维的，无需给出类目。

饼图不在直角坐标系上实现，自然也不需要 xAxis 和 yAxis。

利用下述代码绘制出一个简单的饼图：myChart.setOption({

series : [

{

name: '访问来源',

type: 'pie',

radius: '55%',

data:[

{value:235, name:'视频广告'},

{value:274, name:'联盟广告'},

{value:310, name:'邮件营销'},

{value:335, name:'直接访问'},

{value:400, name:'搜索引擎'}

]

}

]

})

图形显示结果：

ECharts 中的数据项既可以只设成数值，也可以设为一个包含有名称、该数据图形的样式配置、标签配置的对象，具体见 data 文档。

比如上述代码中的 data 属性值是一个包含 name 和 value 属性的对象，而不像第一节里那样每一项都是单个数值。

ECharts 中的 饼图 也支持