码迷,mamicode.com
首页 > 其他好文 > 详细

echarts自己用的一些注释

时间:2017-07-02 22:11:24      阅读:2338      评论:0      收藏:0      [点我收藏+]

标签:back   标签   name   ext   bsp   图标   func   ott   gen   

注释

1、         地图类型http://echarts.baidu.com/demo.html#geo-lines

  • option = {

    backgroundColor: ‘#404a59‘,//背景颜色

    title : {//标题

        text: ‘模拟迁徙‘, //主标题

        subtext: ‘数据纯属虚构‘, //副标题

        left: ‘center‘, //位置

  x:‘center‘,//可以直接设置位置

        textStyle : {//文本样式

            color: ‘#fff‘

fontSize: 20//字体大小

 

        }

    },

    tooltip : {//提示信息

        trigger: ‘item‘//触发类型

    },

    legend: {//图例

        orient: ‘vertical‘, //水平还是垂直

        top: ‘bottom‘, //位置

        left: ‘right‘, //位置

        data:[‘北京 Top10‘, ‘上海 Top10‘, ‘广州 Top10‘], //图例显示数组

        textStyle: {//图例样式

            color: ‘#fff‘

        },

        selectedMode: ‘single‘//单选还是多选(Multiple)

    },

    geo: {//地图

        map: ‘china‘, //具体地图,一个文件

        label: {//地图标签

            emphasis: {//强调,鼠标移动到上面

                show: false//是否显示

            }

        },

        roam: true,

        itemStyle: {//地图每项样式设置

            normal: {//正常状态,鼠标未移入

                areaColor: ‘#323c48‘,

                borderColor: ‘#404a59‘

            },

            emphasis: {//鼠标移入

                areaColor: ‘#2a333d‘

            }

        }

    },

    series: series//地图展示数组,最重要的一部分

};

2、         series详细设置

series.push({

        name: item[0] + ‘ Top10‘, //数组展示名称

        type: ‘lines‘, //展示类型

        zlevel: 1, //层叠级别

        effect: {//效果设置

            show: true,

            period: 6,

            trailLength: 0.7,

            color: ‘#fff‘,

            symbolSize: 3//展示图标的大小

        },

        lineStyle: {//线样式

            normal: {

                color: color[i],

                width: 0,

                curveness: 0.2

            }

        },

        data: convertData(item[1])

    },

    {

        name: item[0] + ‘ Top10‘,

        type: ‘lines‘,

        zlevel: 2,

        symbol: [‘none‘, ‘arrow‘], //标志符号设置

        symbolSize: 10, //标志符号大小

        effect: {

            show: true,

            period: 6,

            trailLength: 0,

            symbol: planePath,

            symbolSize: 15

        },

        lineStyle: {

            normal: {

                color: color[i],

                width: 1,

                opacity: 0.6,

                curveness: 0.2

            }

        },

        data: convertData(item[1])

    },

    {

        name: item[0] + ‘ Top10‘,

        type: ‘effectScatter‘,//散点图

        coordinateSystem: ‘geo‘, //坐标系

        zlevel: 2,

        rippleEffect: {

            brushType: ‘stroke‘

        },

        label: {

            normal: {

                show: true,

                position: ‘right‘,

                formatter: ‘{b}‘//数组的标签展示,也可以是js函数返回值

            }

        },

        symbolSize: function (val) {//标志大小,可以是函数返回值

            return val[2] / 8;

        },

tooltip:{

            formatter: function (val){ //参数表示该项数组内的只

               return val.name+‘:<br/>‘+val.value[2]+"MB";  //换行符

            }

        },

        itemStyle: {

            normal: {

                color: color[i]

            }

        },

        data: item[1].map(function (dataItem) {

            return {

                name: dataItem[1].name,

                value: geoCoordMap[dataItem[1].name].concat([dataItem[1].value])

            };

        })

    });

echarts自己用的一些注释

标签:back   标签   name   ext   bsp   图标   func   ott   gen   

原文地址:http://www.cnblogs.com/bkxdd/p/7107264.html

(0)
(1)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!