同盟军网络小案例展示
百度echarts案例
echarts
教程: 1.引入百度图表插件:(完整版685kb,精简版274kb,常用版430kb,源代码版2.26mb) 自己选择版本,内存越大功能越全;例如下,仅供参考: 常用版 2.在绘图前我们需要为 ECharts 准备一个具备高宽的 DOM 容器。例如下,仅供参考:
3.初始化表格。例如下,仅供参考: var myChart = echarts.init(document.getElementById('main')); 4.指定图表的配置项和数据,例如下,仅供参考 var option = { title: { text: 'ECharts 入门示例' }, tooltip: {}, legend: { data:['销量'] }, xAxis: { data: ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"] }, yAxis: {}, series: [{ name: '销量', type: 'bar',//'bar'为柱状图 'line'为折线图 'pie'为饼状图 //data: [5, 20, 36, 10, 10, 20] //data为数据,格式为数组。也可以用下面这种方式传入数据,优点是可以自定义柱,饼颜色 data: [{value:5,color:'#ff7600'}, {value:5,color:'#ff7600'}, {value:5,color:'#ff7600'}], //itemStyle->normal->color为定义柱,饼颜色,可以省略。也可以设置为'#***',所有的柱状条都为此颜色,也可以自己写个函数将每个柱状条定为随机颜色。 //例如下,仅供参考 itemStyle: { normal: { color: function (value){ return value.data.color; } } } }] }; 5.百度echarts官方文档:http://echarts.baidu.com/api.html
联系我们