利用百度Echarts.js生成雷达图
一、下载地址:http://echarts.baidu.com/
二、看文档(必须的)。可选择的看,先完成想要的功能,再扩展。
三、使用 推荐的 模块化单文件引入。
在在dist文件夹下会有
echarts-line.js : 折线图(如需折柱动态类型切换,require时还需要echarts/chart/bar)
echarts-bar.js : 柱形图(如需折柱动态类型切换,require时还需要echarts/chart/line)
echarts-scatter.js : 散点图
echarts-k.js : K线图
echarts-pie.js : 饼图(如需饼漏斗图动态类型切换,require时还需要echarts/chart/funnel)
echarts-radar.js : 雷达图
echarts-map.js : 地图
echarts-force.js : 力导向布局图(如需力导和弦动态类型切换,require时还需要echarts/chart/chord)
echarts-chord.js : 和弦图(如需力导和弦动态类型切换,require时还需要echarts/chart/force)
echarts-funnel.js : 漏斗图(如需饼漏斗图动态类型切换,require时还需要echarts/chart/pie)
echarts-gauge.js : 仪表盘
echarts-eventRiver.js : 事件河流图
根据需要加载js文件。
四、在<head></head>标签内引入
<script src="./js/echarts.js"></script>
注意文件路径。
然后
<script type="text/javascript"> require.config({ paths: { echarts: ‘./js/dist‘// } }); require( [ ‘echarts‘, ‘echarts/chart/line‘, // ‘echarts/chart/bar‘ ], function (ec) { var myChart = ec.init(document.getElementById(‘main‘));//main就是你要放置图的DOM的ID var option = { .../ } myChart.setOption(option); } ); </script>
五、看文档,熟悉option里面各种选项的意义。
六、做demo实践。
郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。