跟老姚学前端,课程体系更完善,10%基础 + 90%实战演练,快人一步学编程

扫一扫浏览

echarts 图表参数大全

未结贴
0 3580
yaosean站长未认证 2019-10-14 14:32:29
收藏
echarts 中文官方网站直达 下面是echarts配置参数详解,须要的可以查阅
$(function() {
    
    // 路径配置
    require.config({
        paths : {
            // echarts: 'http://echarts.baidu.com/build/dist'
            echarts : './plugins/echarts-2.2.7/doc/example/www/js'
        }
    });
    
    // 使用
    require(
        [ 
          'echarts', 
          'echarts/chart/map' // 使用柱状图就加载bar模块,按需加载
        ], function(ec) {
        // 基于准备好的dom,初始化echarts图表
        var myChart = ec.init(document.getElementById('main'));
        var ecConfig = require('echarts/config');
        var zrEvent = require('zrender/tool/event');
        option = {
            title : {
                // 是否显示
                show: true,
                // 主标题文本,'\n'指定换行
                text: 'iphone销量',
                // 主标题文本超链接
                link: 'http://www.baidu.com',
                // 指定窗口打开主标题超链接,支持'self' | 'blank',不指定等同为'blank'(新窗口)
                target: 'self',
                // 副标题文本,'\n'指定换行
                subtext: '纯属虚构',
                // 副标题文本超链接
                sublink: 'http://www.baidu.com',
                // 指定窗口打开副标题超链接,支持'self' | 'blank',不指定等同为'blank'(新窗口)
                subtarget: 'self',
                // 水平安放位置,默认为左侧,可选为:'center' | 'left' | 'right' | {number}(x坐标,单位px)
                x: 'center',
                // 垂直安放位置,默认为全图顶端,可选为:'top' | 'bottom' | 'center' | {number}(y坐标,单位px)
                y: 'top',
                // 水平对齐方式,默认根据x设置自动调整,可选为: left' | 'right' | 'center
                textAlign: 'center',
                // 标题背景颜色,默认透明
                backgroundColor: 'rgba(0,0,0,0.1)',
                // 标题边框颜色
                borderColor: '#66FF00',
                // 标题边框线宽,单位px,默认为0(无边框)
                borderWidth: 1,
                // 标题内边距,单位px,默认各方向内边距为5,接受数组分别设定上右下左边距,同css,见下图
                padding: [20,40,20,40],
                // 主副标题纵向间隔,单位px,默认为10
                itemGap: 20,
                // 主标题文本样式
                textStyle: {
                    // 颜色
                    color: '#0066FF',
                    // 水平对齐方式,可选为:'left' | 'right' | 'center'
                    align: 'left',
                    // 垂直对齐方式,可选为:'top' | 'bottom' | 'middle'
                    baseline: 'bottom',
                    // 字体系列
                    fontFamily: 'Arial, 宋体, sans-serif',
                    // 字号 ,单位px
                    fontSize: 20,
                    // 样式,可选为:'normal' | 'italic' | 'oblique'
                    fontStyle: 'italic',
                    // 粗细,可选为:'normal' | 'bold' | 'bolder' | 'lighter' | 100 | 200 |... | 900
                    fontWeight: 'normal'
                },
                // 副标题文本样式
                subtextStyle: {
                    // 颜色
                    color: '#FF7F50',
                    // 水平对齐方式,可选为:'left' | 'right' | 'center'
                    align: 'left',
                    // 垂直对齐方式,可选为:'top' | 'bottom' | 'middle'
                    baseline: 'bottom',
                    // 字体系列
                    fontFamily: 'Arial, 宋体, sans-serif',
                    // 字号 ,单位px
                    fontSize: 15,
                    // 样式,可选为:'normal' | 'italic' | 'oblique'
                    fontStyle: 'italic',
                    // 粗细,可选为:'normal' | 'bold' | 'bolder' | 'lighter' | 100 | 200 |... | 900
                    fontWeight: 'normal'
                }
            },
            // 工具提示
            tooltip : {
                // 显示策略,可选为:true(显示) | false(隐藏)
                show: true,
                // tooltip主体内容显示策略,只需tooltip触发事件或显示axisPointer而不需要显示内容时可配置该项为false
                showContent: true,
                // 触发类型,默认数据触发,见下图,可选为:'item' | 'axis'
                trigger: 'item',
                // 位置指定,传入{Array},如[x, y], 固定位置[x, y];传入{Function},如function([x, y]) {return [newX,newY]},默认显示坐标为输入参数,用户指定的新坐标为输出返回。
                // position: getTooltipPosition(0,0),
                // 内容格式器:{string}(Template) | {Function},支持异步回调
                /*formatter: function(data){
                    console.log(data);
                    return data[1]+":"+data[5].count;
                }*/
                // 拖拽重计算独有,数据孤岛内容格式器:{string}(Template) | {Function},见表格下方
                // islandFormatter:
                // 显示延迟,添加显示延迟可以避免频繁切换,特别是在详情内容需要异步获取的场景,单位ms
                showDelay: 0,
                // 隐藏延迟,单位ms
                hideDelay: 0,
                // 动画变换时长,单位s,如果你希望tooltip的跟随实时响应,showDelay设置为0是关键,同时transitionDuration设0也会有交互体验上的差别。
                transitionDuration: 0,
                // 鼠标是否可进入详情气泡中,默认为false,如需详情内交互,如添加链接,按钮,可设置为true。
                //enterable: false,
                // 提示背景颜色,默认为透明度为0.7的黑色
                backgroundColor: 'rgba(0,0,0,0.5)',
                // 提示边框颜色
                borderColor: '#FF7F50',
                // 提示边框圆角,单位px,默认为4
                borderRadius: 10,
                // 提示边框线宽,单位px,默认为0(无边框)
                borderWidth: 2,
                // 提示内边距,单位px,默认各方向内边距为5,接受数组分别设定上右下左边距,同css
                padding: [15,15,15,15],
                // 坐标轴指示器
                /*axisPointer:{
                    // 默认type为line,可选为:'line' | 'cross' | 'shadow' | 'none'(无),指定type后对应style生效
                    type: 'line',
                    // lineStyle设置直线指示器
                    lineStyle: {
                        // 颜色
                        color:'#48b',
                        // 线条样式,可选为:'solid' | 'dotted' | 'dashed', 树图还可以选:'curve' | 'broken'
                        type:'solid',
                        // 线宽
                        width:10,
                        // 折线主线(IE8+)有效,阴影色彩,支持rgba
                        shadowColor:'rgba(0,0,0,0)',
                        // 折线主线(IE8+)有效,阴影模糊度,大于0有效
                        shadowBlur:5,
                        // 折线主线(IE8+)有效,阴影横向偏移,正值往右,负值往左
                        shadowOffsetX:3,
                        // 折线主线(IE8+)有效,阴影纵向偏移,正值往下,负值往上
                        shadowOffsetY:3
                    },
                    // crossStyle设置十字准星指示器
                    crossStyle:{
                        // 颜色
                        color:'#48b',
                        // 线条样式,可选为:'solid' | 'dotted' | 'dashed', 树图还可以选:'curve' | 'broken'
                        type:'solid',
                        // 线宽
                        width:10,
                        // 折线主线(IE8+)有效,阴影色彩,支持rgba
                        shadowColor:'rgba(0,0,0,0)',
                        // 折线主线(IE8+)有效,阴影模糊度,大于0有效
                        shadowBlur:5,
                        // 折线主线(IE8+)有效,阴影横向偏移,正值往右,负值往左
                        shadowOffsetX:3,
                        // 折线主线(IE8+)有效,阴影纵向偏移,正值往下,负值往上
                        shadowOffsetY:3
                    },
                    // shadowStyle设置阴影指示器,areaStyle.size默认为'auto'自动计算,可指定具体宽度
                    shadowStyle:{
                        // 颜色
                        color: 'rgba(150,150,150,0.3)',
                        width: 'auto',
                        // 填充样式,目前仅支持'default'(实填充)
                        type: 'default'
                    }
                },*/
                // 文本样式,默认为白色字体
                textStyle:{
                    // 颜色
                    color: '#FF7F50',
                    // 水平对齐方式,可选为:'left' | 'right' | 'center'
                    align: 'left',
                    // 垂直对齐方式,可选为:'top' | 'bottom' | 'middle'
                    baseline: 'bottom',
                    // 字体系列
                    fontFamily: 'Arial, 宋体, sans-serif',
                    // 字号 ,单位px
                    fontSize: 20,
                    // 样式,可选为:'normal' | 'italic' | 'oblique'
                    fontStyle: 'italic',
                    // 粗细,可选为:'normal' | 'bold' | 'bolder' | 'lighter' | 100 | 200 |... | 900
                    fontWeight: 'normal'
                }
            },
            legend: {
                // 显示策略,可选为:true(显示) | false(隐藏)
                show: true,
                // 布局方式,默认为水平布局,可选为:'horizontal' | 'vertical'
                orient: 'vertical',
                // 水平安放位置,默认为全图居中,可选为:'center' | 'left' | 'right' | {number}(x坐标,单位px)
                x: 'left',
                // 垂直安放位置,默认为全图顶端,可选为:'top' | 'bottom' | 'center' | {number}(y坐标,单位px)
                y: 'top',
                // 图例背景颜色,默认透明
                backgroundColor: 'rgba(0,0,0,0.1)',
                // 图例边框颜色
                borderColor: '#0066FF',
                // 图例边框线宽,单位px,默认为0(无边框)
                borderWidth: 1,
                // 图例内边距,单位px,默认各方向内边距为5,接受数组分别设定上右下左边距,同css
                padding: [15,15,15,15],
                // 各个item之间的间隔,单位px,默认为10,横向布局时为水平间隔,纵向布局时为纵向间隔
                itemGap: 20,
                // 图例图形宽度
                itemWidth: 30,
                // 图例图形高度
                itemHeight: 20,
                // 默认只设定了图例文字颜色,更个性化的是,要指定文字颜色跟随图例,可设color为'auto'
                textStyle:{
                    // 颜色
                    color: '#FF7F50',
                    // 水平对齐方式,可选为:'left' | 'right' | 'center'
                    align: 'left',
                    // 垂直对齐方式,可选为:'top' | 'bottom' | 'middle'
                    baseline: 'bottom',
                    // 字体系列
                    fontFamily: 'Arial, 宋体, sans-serif',
                    // 字号 ,单位px
                    fontSize: 20,
                    // 样式,可选为:'normal' | 'italic' | 'oblique'
                    fontStyle: 'italic',
                    // 粗细,可选为:'normal' | 'bold' | 'bolder' | 'lighter' | 100 | 200 |... | 900
                    fontWeight: 'normal'
                },
                // 文本格式器:{string}(Template) | {Function},模板变量为'{name}',函数回调参数为name
                /*formatter: function(data){
                    console.log(data);
                    return data[1]+":"+data[5].count;
                },*/
                // 选择模式,默认开启图例开关,可选single,multiple
                selectedMode: true,
                // 配置默认选中状态,可配合LEGEND.SELECTED事件做动态数据载入
                /*selected: {
                    '降水量' : false
                },*/
                // 图例内容数组
                data:[{name:'iphone3'/*,textStyle:{Object},icon:{string}*/},
                      {name:'iphone4'/*,textStyle:{Object},icon:{string}*/},
                      {name:'iphone5'/*,textStyle:{Object},icon:{string}*/}]
            },
            // 值域选择,每个图表最多仅有一个值域控件
            dataRange: {
                // 显示策略,可选为:true(显示) | false(隐藏)
                show: true,
                // 布局方式,默认为垂直布局,可选为:'horizontal' | 'vertical'
                orient: 'horizontal',
                // 水平安放位置,默认为全图左对齐,可选为:'center' | 'left' | 'right' | {number}(x坐标,单位px)
                x: 'left',
                // 垂直安放位置,默认为全图底部,可选为:'top' | 'bottom' | 'center' | {number}(y坐标,单位px)
                y: 'bottom',
                // 值域控件背景颜色,默认透明
                backgroundColor: 'rgba(0,0,0,0.1)',
                // 图例边框颜色
                borderColor: '#0066FF',
                // 图例边框线宽,单位px,默认为0(无边框)
                borderWidth: 1,
                // 图例内边距,单位px,默认各方向内边距为5,接受数组分别设定上右下左边距,同css
                padding: [15,15,15,15],
                // 各个item之间的间隔,单位px,默认为10,横向布局时为水平间隔,纵向布局时为纵向间隔
                itemGap: 20,
                // 图例图形宽度
                itemWidth: 30,
                // 图例图形高度
                itemHeight: 20,
                // 指定的最小值,eg: 0,默认无,必须参数,唯有指定了splitList时可缺省min。
                min: 0,
                // 指定的最大值,eg: 100,默认无,必须参数,唯有指定了splitList时可缺省max
                max: 2500,
                // 小数精度,默认为0,无小数点,当 min ~ max 间在当前精度下无法整除splitNumber份时,精度会自动提高以满足均分,不支持不等划分
                precision: 1,
                // 分割段数,默认为5,为0时为线性渐变,calculable为true是默认均分100份
                splitNumber: 10,
                // 自定义分割方式,支持不等距分割。splitList被指定时,splitNumber将被忽略。
                /*splitList: [
                    {start: 1500},
                    {start: 900, end: 1500},
                    {start: 310, end: 1000},
                    {start: 200, end: 300},
                    {start: 10, end: 200, label: '10 到 200(自定义label)'},
                    {start: 5, end: 5, label: '5(自定义特殊颜色)', color: 'black'},
                    {end: 10}
                ],*/
                // 用于设置dataRange的初始选中范围。calculable为true时有效。
                range: {start: 0, end: 100},
                // 选择模式,默认开启值域开关,可选single,multiple
                selectedMode: 'multiple',
                // 是否启用值域漫游,启用后无视splitNumber和splitList,值域显示为线性渐变
                calculable : true,
                // 是否启用地图hover时的联动响应
                hoverLink: true,
                // 值域漫游是否实时显示,在不支持Canvas的浏览器中该值自动强制置为false
                realtime:true,
                // 值域颜色标识,颜色数组长度必须>=2,颜色代表从数值高到低的变化,即颜色数组低位代表数值高的颜色标识 ,支持Alpha通道上的变化(rgba)
                color:['#e42515','#fad3d0'],
                // 内容格式器:{string}(Template) | {Function},模板变量为'{value}'和'{value2}',代表数值起始值和结束值,函数参数两个,含义同模板变量,当calculable为true时模板变量仅有'{value}'
                /*formatter : function(v, v2){
                    if (v2 < 1000) { return '低于' + v2;}
                    else if (v > 1000) { return '高于' + v;}
                    else { return '中'; }
                },*/
                //     值域文字显示,splitNumber生效时默认以计算所得数值作为值域文字显示,可指定长度为2的文本数组显示简介的值域文本,如['高', '低'],'\n'指定换行
                text:['高','低'],
                // 默认只设定了值域控件文字颜色
                textStyle:{
                    // 颜色
                    color: '#FF7F50',
                    // 水平对齐方式,可选为:'left' | 'right' | 'center'
                    align: 'left',
                    // 垂直对齐方式,可选为:'top' | 'bottom' | 'middle'
                    baseline: 'bottom',
                    // 字体系列
                    fontFamily: 'Arial, 宋体, sans-serif',
                    // 字号 ,单位px
                    fontSize: 20,
                    // 样式,可选为:'normal' | 'italic' | 'oblique'
                    fontStyle: 'italic',
                    // 粗细,可选为:'normal' | 'bold' | 'bolder' | 'lighter' | 100 | 200 |... | 900
                    fontWeight: 'normal'
                }
            },
            // 工具箱,每个图表最多仅有一个工具箱
            toolbox: {
                // 显示策略,可选为:true(显示) | false(隐藏)
                show: true,
                // 布局方式,默认为水平布局,可选为:'horizontal' | 'vertical'
                orient : 'horizontal',
                // 水平安放位置,默认为全图居中,可选为:'center' | 'left' | 'right' | {number}(x坐标,单位px)
                x: 'right',
                // 垂直安放位置,默认为全图顶端,可选为:'top' | 'bottom' | 'center' | {number}(y坐标,单位px)
                y: 'bottom',
                // 工具箱背景颜色,默认透明
                backgroundColor: 'rgba(218,112,214,0.6)',
                // 工具箱边框颜色
                borderColor: '#0066FF',
                // 工具箱边框线宽,单位px,默认为0(无边框)
                borderWidth: 1,
                // 工具箱内边距,单位px,默认各方向内边距为5,接受数组分别设定上右下左边距,同css
                padding: [15,15,15,15],
                // 各个item之间的间隔,单位px,默认为10,横向布局时为水平间隔,纵向布局时为纵向间隔
                itemGap: 20,
                // 工具箱icon大小,单位(px)
                itemSize: 20,
                // 工具箱icon颜色序列,循环使用,同时支持在具体feature内指定color
                color:['#1e90ff','#22bb22','#4b0082','#d2691e'],
                // 禁用颜色定义
                disableColor:'#fff',
                // 生效颜色定义
                effectiveColor:'red',
                // 是否显示工具箱文字提示,默认启用
                showTitle:true,
                // 工具箱提示文字样式
                textStyle:{
                    // 颜色
                    color: '#FF7F50',
                    // 水平对齐方式,可选为:'left' | 'right' | 'center'
                    align: 'left',
                    // 垂直对齐方式,可选为:'top' | 'bottom' | 'middle'
                    baseline: 'bottom',
                    // 字体系列
                    fontFamily: 'Arial, 宋体, sans-serif',
                    // 字号 ,单位px
                    fontSize: 20,
                    // 样式,可选为:'normal' | 'italic' | 'oblique'
                    fontStyle: 'italic',
                    // 粗细,可选为:'normal' | 'bold' | 'bolder' | 'lighter' | 100 | 200 |... | 900
                    fontWeight: 'normal'
                },
                // 启用功能,目前支持feature见下,工具箱自定义功能回调处理
                feature : {
                    // 辅助线标志,分别是启用,删除上一条,删除全部,可设置更多属性
                    mark : {
                        show : true,
                        title : {
                            mark : '辅助线开关',
                            markUndo : '删除辅助线',
                            markClear : '清空辅助线'
                        },
                        lineStyle : {
                            width : 2,
                            color : '#1e90ff',
                            type : 'dashed'
                        }
                    },
                    // 框选区域缩放,自动与存在的dataZoom控件同步,上图icon左数4/5,分别是启用,缩放后退
                    dataZoom : {
                        show : true,
                        title : {
                            dataZoom : '区域缩放',
                            dataZoomReset : '区域缩放后退'
                        }
                    },
                    // 数据视图,上图icon左数6,打开数据视图,可设置更多属性
                    dataView : {
                        show : true,
                        title : '数据视图',
                        readOnly: false,
                        lang: ['数据视图', '关闭', '刷新']
                    },
                    // 动态类型切换,支持直角系下的折线图、柱状图、堆积、平铺转换,上图icon左数6~14,分别是切换为堆积,切换为平铺,切换折线图,切换柱形图,切换为力导向布局图,切换为和弦图,切换为饼图,切换为漏斗图
                    magicType: {
                        show : true,
                        title : {
                            line : '折线图切换',
                            bar : '柱形图切换',
                            stack : '堆积',
                            tiled : '平铺',
                            force: '力导向布局图切换',
                            chord: '和弦图切换',
                            pie: '饼图切换',
                            funnel: '漏斗图切换'
                        },
                        option: {
                            // line: {...},
                            // bar: {...},
                            // stack: {...},
                            // tiled: {...},
                            // force: {...},
                            // chord: {...},
                            // pie: {...},
                            // funnel: {...}
                        },
                        type : []
                    },
                    // 还原,复位原始图表
                    restore : {
                        show : true,
                        title : '还原'
                    },
                    // 保存图片(IE8-不支持),可设置更多属性
                    saveAsImage : {
                        show : true,
                        title : '保存为图片',
                        type : 'png',
                        lang : ['点击保存']
                    }
                }
            },
            // 缩放漫游组件,仅对地图有效
            roamController: {
                // 显示策略,可选为:true(显示) | false(隐藏)
                show: true,
                // 水平安放位置,默认为左侧,可选为:'center' | 'left' | 'right' | {number}(x坐标,单位px)
                x: 'right',
                // 垂直安放位置,默认为全图顶端,可选为:'top' | 'bottom' | 'center' | {number}(y坐标,单位px)
                y: 'top',
                // 指定宽度,决定4向漫游圆盘大小,可指定 {number}(宽度,单位px)
                width: 120,
                // 指定高度,缩放控制键默认会在指定高度的最下方最大化显示,可指定 {number}(高度,单位px)
                height:200,
                // 缩放漫游组件背景颜色,默认透明
                backgroundColor:'rgba(0,0,0,0.1)',
                // 缩放漫游组件边框颜色
                borderColor: '#1e90ff',
                // 缩放漫游组件边框线宽,单位px,默认为0(无边框)
                borderWidth: 1,
                // 缩放漫游组件内边距,单位px,默认各方向内边距为5,接受数组分别设定上右下左边距,同css
                padding: [15,15,15,15],
                // 漫游组件文字填充颜色
                fillerColor:'#000',
                // 控制手柄主体颜色
                handleColor:'#e3655a',
                // 4向漫游移动步伐,单位px
                step:10,
                // 必须,指定漫游组件可控地图类型
                mapTypeControl: {
                    'china': true
                }
            },
            series : [
                {
                    // 图表类型,必要参数!如为空或不支持类型,则该系列数据不被显示。可选为: 
                    // 'line'(折线图) | 'bar'(柱状图) | 'scatter'(散点图) | 'k'(K线图) 
                    // 'pie'(饼图) | 'radar'(雷达图) | 'chord'(和弦图) | 'force'(力导向布局图) | 'map'(地图)
                    type: 'map',
                    // 系列名称
                    name: 'iphone3',
                    // 地图类型,支持world,china及全国34个省市自治区
                    mapType: 'china',
                    // 是否开启滚轮缩放和拖拽漫游,默认为false(关闭),其他有效输入为true(开启),'scale'(仅开启滚轮缩放),'move'(仅开启拖拽漫游)
                    roam: false,
                    // 图形样式
                    itemStyle:{
                        // 默认状态下地图的文字
                        normal:{label:{show:true}},
                        // 鼠标放到地图上面显示文字
                        emphasis:{label:{show:true}}
                    },
                    data:[
                        {name: '北京',value: Math.round(Math.random()*1000)},
                        {name: '天津',value: Math.round(Math.random()*1000)},
                        {name: '上海',value: Math.round(Math.random()*1000)},
                        {name: '重庆',value: Math.round(Math.random()*1000)},
                        {name: '河北',value: Math.round(Math.random()*1000)},
                        {name: '河南',value: Math.round(Math.random()*1000)},
                        {name: '云南',value: Math.round(Math.random()*1000)},
                        {name: '辽宁',value: Math.round(Math.random()*1000)},
                        {name: '黑龙江',value: Math.round(Math.random()*1000)},
                        {name: '湖南',value: Math.round(Math.random()*1000)},
                        {name: '安徽',value: Math.round(Math.random()*1000)},
                        {name: '山东',value: Math.round(Math.random()*1000)},
                        {name: '新疆',value: Math.round(Math.random()*1000)},
                        {name: '江苏',value: Math.round(Math.random()*1000)},
                        {name: '浙江',value: Math.round(Math.random()*1000)},
                        {name: '江西',value: Math.round(Math.random()*1000)},
                        {name: '湖北',value: Math.round(Math.random()*1000)},
                        {name: '广西',value: Math.round(Math.random()*1000)},
                        {name: '甘肃',value: Math.round(Math.random()*1000)},
                        {name: '山西',value: Math.round(Math.random()*1000)},
                        {name: '内蒙古',value: Math.round(Math.random()*1000)},
                        {name: '陕西',value: Math.round(Math.random()*1000)},
                        {name: '吉林',value: Math.round(Math.random()*1000)},
                        {name: '福建',value: Math.round(Math.random()*1000)},
                        {name: '贵州',value: Math.round(Math.random()*1000)},
                        {name: '广东',value: Math.round(Math.random()*1000)},
                        {name: '青海',value: Math.round(Math.random()*1000)},
                        {name: '西藏',value: Math.round(Math.random()*1000)},
                        {name: '四川',value: Math.round(Math.random()*1000)},
                        {name: '宁夏',value: Math.round(Math.random()*1000)},
                        {name: '海南',value: Math.round(Math.random()*1000)},
                        {name: '台湾',value: Math.round(Math.random()*1000)},
                        {name: '香港',value: Math.round(Math.random()*1000)},
                        {name: '澳门',value: Math.round(Math.random()*1000)}
                    ]
                },
                {
                    name: 'iphone4',
                    type: 'map',
                    mapType: 'china',
                    itemStyle:{
                        normal:{label:{show:true}},
                        emphasis:{label:{show:true}}
                    },
                    data:[
                        {name: '北京',value: Math.round(Math.random()*1000)},
                        {name: '天津',value: Math.round(Math.random()*1000)},
                        {name: '上海',value: Math.round(Math.random()*1000)},
                        {name: '重庆',value: Math.round(Math.random()*1000)},
                        {name: '河北',value: Math.round(Math.random()*1000)},
                        {name: '安徽',value: Math.round(Math.random()*1000)},
                        {name: '新疆',value: Math.round(Math.random()*1000)},
                        {name: '浙江',value: Math.round(Math.random()*1000)},
                        {name: '江西',value: Math.round(Math.random()*1000)},
                        {name: '山西',value: Math.round(Math.random()*1000)},
                        {name: '内蒙古',value: Math.round(Math.random()*1000)},
                        {name: '吉林',value: Math.round(Math.random()*1000)},
                        {name: '福建',value: Math.round(Math.random()*1000)},
                        {name: '广东',value: Math.round(Math.random()*1000)},
                        {name: '西藏',value: Math.round(Math.random()*1000)},
                        {name: '四川',value: Math.round(Math.random()*1000)},
                        {name: '宁夏',value: Math.round(Math.random()*1000)},
                        {name: '香港',value: Math.round(Math.random()*1000)},
                        {name: '澳门',value: Math.round(Math.random()*1000)}
                    ]
                },
                {
                    name: 'iphone5',
                    type: 'map',
                    mapType: 'china',
                    itemStyle:{
                        normal:{label:{show:true}},
                        emphasis:{label:{show:true}}
                    },
                    data:[
                        {name: '北京',value: Math.round(Math.random()*1000)},
                        {name: '天津',value: Math.round(Math.random()*1000)},
                        {name: '上海',value: Math.round(Math.random()*1000)},
                        {name: '广东',value: Math.round(Math.random()*1000)},
                        {name: '台湾',value: Math.round(Math.random()*1000)},
                        {name: '香港',value: Math.round(Math.random()*1000)},
                        {name: '澳门',value: Math.round(Math.random()*1000)}
                    ]
                }
            ]
        };
 
        myChart.setOption(option);
    });
});

内容来源于:https://blog.csdn.net/yuhan_0590/article/details/93488362

最近热帖 HOT TOPIC
【全套视频】thinkphp5视频教程 95054
父元素flex之后,子元素高度自适应问题 11386
一张纸的厚度是0.01毫米,则该纸对折30次后是多厚(据说超过珠穆朗玛峰的高度)php实现 10593
如何收废品才能赚钱,有什么技巧?揭秘垃圾回收行业的一些规则 10168
thinkphp5隐藏默认模块的一些问题 10062
api接口文档插件easydoc的基本用法,快速搞定接口文档 9877
PHP如何判断字符串是否为json格式 9710
omnicore rpc api中文手册【usdt】 9638
教你如果处理高并发数据不同步的问题php篇 9354
关于thinkphp5.0.x getshell漏洞的说明 9268
月度热议HOT COMMENTS
【全套视频】thinkphp5视频教程 75
tpframe 后续版本你希望有的功能是什么(分享贴) 12
权限那里怎么一登录别的账号就报错啊 9
关于tpframe的一点话题 6
cms插件在分类排序的时候JSON错误 6
基于tpframe v3.x 的微信公众号插件已批量上线 5
tpframe插件tcms插件v2.2已发布上线,欢迎下载使用 5
tpframe6.0马上就要跟大家见面了,一次全新的升级 5
透析thinkphp5升级版开发框架tpframe 3
新增的管理员没有权限操作CMS模块。 3
爆料早知道: