echarts

echarts

一个基于 JavaScript 的开源可视化图表库

常用的配置项

title: 标题组件，包含标题和副标题;

    text    //主题标题支持使用/n换行;

    subtext  /主题组件的副标题;

    textStyle   //主题标题的样式;
    
    subtextStyle   //副题标题的样式;

legend:图例组件。图例组件展现了不同系列的标记(symbol)，颜色和名字。可以通过点击图例控制哪些系列不显示 (包含了series中每个图表数据的名字)；

    type   //规定了图列组建的类型;

    selected    //规定了图标选中的状态(默认选中)

    data:[{}]    //图列的数据数组，里面包含图例项的name名称;

series //图列组件的图列项 包含各种属性type属性的配置项;

    type:line   //折线图；

    type:bar   //饼状图；

            roseType    //是否展示南丁格尔玫瑰图radius  展示

    type:scatter  //散装图

xAxis //直角坐标系 grid 中的 x 轴;

    position    //x轴的位置

    offset   //偏移量

    name   //坐标轴的名称

    nameTextStyle   //坐标轴名字的样式;

yAxis //直角坐标系grid中的y轴;

     nameLocation  //坐标轴显示的位置;

     realtimeSort  //设置动态柱状图;

异步数据更新

思想： 先获取图标的options对象，然后打点单独修改options的值，在将options对象设置给图表;

方法： echart.getOption() //获取options对象;

echart.setOption() //设置options对象;

给图表绑定事件

dispatchAction({}) //派发事件 option参数为type:"" 设置事件的类型;

on(“事件类型”,function()) //绑定事件; 需要单一绑定事件的要进行判断 如多个图表类型需要判断类型添加事件;

type: ‘legendSelectchanged’ //给图列租添加事件(legend)