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%',
            width: '97%',
            height: '30%',
            containLabel: true
        },{
            left: '3%',
            top: '34%',
            width: '97%',
            height: '30%',
            containLabel: true
        },{
            left: '3%',
            top: '69%',
            width: '97%',
            height: '30%',
            containLabel: true
        }
    ],
    tooltip : {
        // trigger: 'axis',
        showDelay : 0,
        axisPointer:{
            show: true,
            type : 'cross',
            lineStyle: {
                type : 'dashed',
                width : 1
            }
        }
    },
    toolbox: {
        feature: {
            dataZoom: {},
            brush: {
                type: ['rect', 'polygon', 'clear']
            }
        }
    },
    brush: {
    },
    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]
            }
        }
    ]
};