ECharts简介

什么是ECharts

ECharts是百度开源的纯 Javascript 图表库，目前开源可以与highcharts相匹敌的一个图表库.支持折线图（区域图）、柱状图（条状图）、散点图（气泡图）、K线图、饼图（环形图）、雷达图（填充雷达图）、和弦图、力导向布局图、地图、仪表盘、漏斗图、事件河流图等12类图表，同时提供标题，详情气泡、图例、值域、数据区域、时间轴、工具箱等7个可交互组件，支持多图表、组件的联动和混搭展现。

简单配置

1.Head内通过script引入ECharts3的js：<script src="echarts.min.js"></script>
2.为 ECharts 准备一个具备大小（宽高）的 DOM :<div id = "main" style="width:600px;height: 400px;"></div>
3.初始化echarts实例var myChart = echarts.init(document.getElementById('main'));
4.设置Option中参数，指定图表的配置项和数据
5.使用setoption生成图表显示图表：myChart.setOption(option);

图表名词

• line：折线图，堆积折线图，区域图，堆积区域图。
• bar：柱形图（纵向），堆积柱形图，条形图（横向），堆积条形图。
• scatter：散点图，气泡图。散点图至少需要横纵两个数据，更高维度数据加入时可以映射为颜色或大小，当映射到大小时则为气泡图
• k：K线图，蜡烛图。常用于展现股票交易数据。
• pie：饼图，圆环图。饼图支持两种（半径、面积）南丁格尔玫瑰图模式
• radar：雷达图，填充雷达图。高维度数据展现的常用图表。
• chord：和弦图。常用于展现关系数据，外层为圆环图，可体现数据占比关系，内层为各个扇形间相互连接的弦，可体现关系数据
• force ：力导布局图。常用于展现复杂关系网络聚类布局。
• map：地图。内置世界地图、中国及中国34个省市自治区地图数据、可通过标准GeoJson扩展地图类型。支持svg扩展类地图应用，如室内地图、运动场、物件构造等。
• gauge：仪表盘。用于展现关键指标数据，常见于BI类系统。
• funnel：漏斗图。用于展现数据经过筛选、过滤等流程处理后发生的数据变化，常见于BI类系统。
• evnetRiver：事件河流图。常用于展示具有时间属性的多个事件，以及事件随时间的演化。
• treemap：矩形式树状结构图，简称：矩形树图。用于展示树形数据结构，优势是能最大限度展示节点的尺寸特征。
• venn：韦恩图。用于展示集合以及它们的交集。

问题补充

折线图的折线平滑显示

series: [
    smooth: true,
]

设置图例的形状

修改图例的icon，自带的有'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow'

legend : { //=========圖表控件
                    show : true,
                    data : [ {
                        name : '负载',
                        
                        icon : 'rect'
            
                    },
                   {
                        name : '用户名',
                        icon : 'roundRect'
                    } ]
                }

参考

Echarts force图形小节
ECharts 实现人民的名义关系图谱
Echarts3 关系图-力导向布局图
可伸缩力导向图
Echarts3 试用总结
Echarts3教程
echarts3生成关系网络关系力向图