zoukankan      html  css  js  c++  java
  • echarts散点图例子scatter-weight折腾记之echarts参数修改

    上一篇折腾记地址:https://www.cnblogs.com/qtx-/p/11606541.html

    1、修改echarts的markline为虚线;

    2、去掉echarts的markline的箭头;

    以下代码可实现:

                markLine : {
                    symbol:'none',
                    lineStyle: {
                        normal: {
                            type: 'dashed'
                        }
                    },
                    label:{
                        formatter:'采购价格红线值{c}',
                        position:'middle'
                    },
                    data : [
                        {type : 'average', name: '平均值'}
                    ]
                }

    完整配置如下:

    option = {
        dataset:{
            source:[[61.2,51.6,74,"北京分"],[67.5,59,75.3,"广州分"],[59.5,49.2,9305,"浙江分"],[57,63,8605,"石家庄分"],[55.8,53.6,87.2,"黑龙江分"],[70,59,8105,"河南分"],[59.1,47.6,84,"福建分"],[66,69.8,8405,"陕西分"],[76.2,66.8,75,"内蒙古分"],[76.2,null,75,"内蒙古分001"],[null,66.8,75,"内蒙古分002"],[76.2,66.8,null,"内蒙古分003"],[76.2,null,75,"内蒙古分004"]],
            dimensions:['采购价格','销售价格','销量','分公司名称']
        },
        title : {
            text: '男性女性身高体重分布',
            subtext: '抽样调查来自: Heinz  2003'
        },
        grid: [{
                left: '3%',
                top: '0%',
                 '97%',
                height: '30%',
                containLabel: true
            },{
                left: '3%',
                top: '34%',
                 '97%',
                height: '30%',
                containLabel: true
            },{
                left: '3%',
                top: '69%',
                 '97%',
                height: '30%',
                containLabel: true
            }
        ],
        tooltip : {
            // trigger: 'axis',
            showDelay : 0,
            axisPointer:{
                show: true,
                type : 'cross',
                lineStyle: {
                    type : 'dashed',
                    width : 1
                }
            }
        },
        toolbox: {
            feature: {
                dataZoom: {},
                 {
                    type: ['rect', 'polygon', 'clear']
                }
            }
        },
         {
        },
        legend: {
            data: ['女性','男性'],
            left: 'center'
        },
        xAxis : [
            {
                gridIndex: 0,
                type : 'category',
                scale:true,
                axisLabel : {
                    formatter: '{value}'
                },
                axisLine:{
                    symbol:['none','arrow']  
                },
                splitLine: {
                    show: false
                }
            },
            {
                gridIndex: 1,
                type : 'category',
                scale:true,
                axisLabel : {
                    formatter: '{value}'
                },
                splitLine: {
                    show: false
                }
            },
            {
                gridIndex: 2,
                type : 'category',
                scale:true,
                axisLabel : {
                    formatter: '{value}'
                },
                splitLine: {
                    show: false
                }
            }
        ],
        yAxis : [
            {
                gridIndex: 0,
                type : 'value',
                scale:true,
                splitLine: {
                    show: false
                }
            },
            {
                gridIndex: 1,
                type : 'value',
                scale:true,
                splitLine: {
                    show: false
                }
            },
            {
                gridIndex: 2,
                type : 'value',
                scale:true,
                splitLine: {
                    show: false
                }
            }
        ],
        series : [
            {
                name:'采购价格',
                xAxisIndex: 0,
                yAxisIndex: 0,
                type:'scatter',
                encode: {
                    x:3,
                    y:0,
                    tooltip: [0, 1, 2]
                },
                markLine : {
                    symbol:'none',
                    lineStyle: {
                        normal: {
                            type: 'dashed'
                        }
                    },
                    label:{
                        formatter:'采购价格红线值{c}',
                        position:'middle'
                    },
                    data : [
                        {type : 'average', name: '平均值'}
                    ]
                }
            },
            {
                name:'销售价格',
                xAxisIndex: 1,
                yAxisIndex: 1,
                type:'scatter',
                encode: {
                    x:3,
                    y:1,
                    tooltip: [0, 1, 2]
                },
                markLine : {
                    lineStyle: {
                        normal: {
                            type: 'solid'
                        }
                    },
                    label:{
                        formatter:'销售价格红线值{c}',
                        position:'middle'
                    },
                    data : [
                            {type : 'average', name: '平均值'}
                    ]
                }
            },
            {
                type: 'bar',
                xAxisIndex: 2,
                yAxisIndex: 2,
                encode: {
                    x: 3,
                    y: 2,
                    tooltip: [0, 1, 2, 3]
                }
            }
        ]
    };
  • 相关阅读:
    苹果一体机发射Wi-Fi
    iphone 屏蔽系统自动更新,消除设置上的小红点
    data parameter is nil 异常处理
    copy与mutableCopy的区别总结
    java axis2 webservice
    mysql 远程 ip访问
    mysql 存储过程小问题
    mysql游标错误
    is not writable or has an invalid setter method错误的解决
    Struts2中关于"There is no Action mapped for namespace / and action name"的总结
  • 原文地址:https://www.cnblogs.com/qtx-/p/11606541.html
Copyright © 2011-2022 走看看