散点图范围域ECharts Gallery

20:11:45图表已生成
代码
//				var xData = ["2016/10/23\n第1次", "2016/10/23\n第2次", "2016/10/23\n第3次", "2016/10/24\n第1次", "2016/10/24\n第2次", "2016/10/24\n第3次",
//					"2016/10/25\n第1次", "2016/10/25\n第2次", "2016/10/25\n第3次", "2016/10/26\n第1次", "2016/10/26\n第2次", "2016/10/26\n第3次",
//					"2016/10/27\n第1次", "2016/10/27\n第2次", "2016/10/27\n第3次", "2016/10/28\n第1次", "2016/10/28\n第2次", "2016/10/28\n第3次",
//					"2016/10/29\n第1次", "2016/10/29\n第2次", "2016/10/29\n第3次", "2016/10/30\n第1次", "2016/10/30\n第2次", "2016/10/30\n第3次",
//					"2016/10/31\n第1次", "2016/10/31\n第2次", "2016/10/31\n第3次", "2016/11/01\n第3次", "2016/11/08\n第1次", "2016/11/08\n第2次", "2016/11/08\n第3次",
//					"2016/11/09\n第1次", "2016/11/09\n第2次", "2016/11/09\n第3次", "2016/11/10\n第1次", "2016/11/10\n第2次", "2016/11/10\n第3次",
//					"2016/11/11\n第1次", "2016/11/11\n第2次", "2016/11/11\n第3次", "2016/11/14\n第1次", "2016/11/14\n第2次", "2016/11/14\n第3次",
//					"2016/11/15\n第1次", "2016/11/15\n第2次", "2016/11/15\n第3次", "2016/11/16\n第1次", "2016/11/16\n第2次", "2016/11/16\n第3次",
//					"2016/11/17\n第1次", "2016/11/17\n第2次", "2016/11/17\n第3次"
//				];
var xData = [1.0, 1.5, 2.0];
var yData = ['', '-2.0', '-1.0', '0', '1.0', '2.0', '']
    /*
     * 标准差为3*/

var gridHight = 400;
var xMiddleLine = -(gridHight / 2);
option = {
    grid: {
        left: 100,
        height: 400,
        width: 400,
        //						bottom:100
    },
    legend: {
        data: ['method', 'peer', 'allLabs']
    },
    tooltip: {
        trigger: 'item'
    },
    xAxis: [{ //x轴value
        name: 'CVI',
        type: 'value',
        min: 0,
        max: 2.5,
        // splitNumber:4,//仅在category中有效
        // minInterval:1,
        // offset: -200, //相对于默认位置的偏移
        axisTick: {
            show: false
        },
        axisLabel: {
            // 			show:false
            textStyle: {
                color: "#99999"
            }
        },
        axisLine: {
            lineStyle: {
                color: '#cccccc'
            }
        },
        nameTextStyle: {
            color: "#99999"
        }

    }, { //中间红线 value
        show: false,
        type: 'value',
        min: 0,
        max: 2.5,
        offset: xMiddleLine,
        axisTick: {
            show: true
        },
        axisLabel: {
            show: false
        },
        axisLine: {
            show: true,
            lineStyle: {
                // color: '#a9a9a9'
                // color: 'red'
            }
        },

    }, { //中间线带箭头
        show: false,
        type: 'category',
        data: ['a','b','c','d'],
        axisTick:{
            show:true
        }

    }],
    yAxis: [{ //Y0
            show: true,
            type: 'value',
            min: (-3),
            max: 3,
            position: 'right',
            axisLine: {
                show: false
            },
            axisTick: {
                show: false
            },
            axisLabel: {
                show: false

            },splitLine:{
                lineStyle:{
                    // color:"#e3e3e3"
                }
            }

        }, { //1
            show: true,
            name: 'SDI',
            type: 'category',
            data: yData,
            // data: ['最小', '(' + -3 + ')-2SDI', '(' + 0 + ')-1SDI', '(' + 3 + ')+0', '(' + +3 + ')1SDI', '(' + 6 + ')2SDI', '最大'],
            // 		data:[1,2,3,4,5,6,],
            boundaryGap: false, //向边缘两边对齐
            axisTick: {
                show: false
            },
            axisLine: {
                lineStyle: {
                    color: '#a9a9a9'
                }
            },
            axisLabel: {
                textStyle: {
                    color: "#99999"
                }
            },
            nameTextStyle: {
                color: '#99999'
            }
        }, { //差1
            show: false,
            type: 'category',
            // data: ['', '(' + -3 + ')-2SDI', '(' + 0 + ')-1SDI', '(' + 3 + ')+0', '(' + +3 + ')1SDI', '(' + 6 + ')2SDI', ''],
            // 		data:[1,2,3,4,5,6,],
            // boundaryGap: false,
            data: ['', '', '', '', '', ''],
            offset: 20,
            boundaryGap: true,
            axisTick: {
                interval: 0
            }
        }, { //差1.5
            show: false,
            type: 'category',
            // data: ['', '(' + -3 + ')-2SDI', '(' + 0 + ')-1SDI', '(' + 3 + ')+0', '(' + +3 + ')1SDI', '(' + 6 + ')2SDI', ''],
            // 		data:[1,2,3,4,5,6,],
            // boundaryGap: false,
            data: ['', '', '', '', '', '', '', '', '', '', '',''], //六分
            boundaryGap: true,
            offset: 40,
            axisTick: {
                interval: 0
            }
        }, { //差2
            show: false,
            type: 'category',
            data: ['', '', '', '', '', ''],//二分
            axisTick: {
                interval: 0
            },
            offset: 60
        }, { //中间线带箭头Y
            show: false,
            type: 'value',
            min: -3,
            max: 3,
        }

    ],
    series: [{
            name: 'method',
            type: 'scatter',
            data: [
                [0.2, -0.24],
                // [1, 2.3, 40],
                // [1.5, 4.5, 30],

            ],
            markArea: {
                silent: true,

            },
            itemStyle: {
                normal: {
                    // color:'#fac747'
                    color: 'rgb(250,199,71)'
                }
            },
            xAxisIndex: 0,
            yAxisIndex: 0
        }, {
            name: 'peer',
            type: 'scatter',
            //						data: ['1', '4', '-1',],
            data: [
                // [0.4, 1.5, 15],
                [0.7, -0.27],
                // [1.5, 4.5, 30],

            ],
            markArea: {
                silent: true,

            },
            itemStyle: {
                normal: {
                    // color:'#93dfb0'
                    color: 'rgb(147,223,176)'
                }
            },
            xAxisIndex: 0,
            yAxisIndex: 0
        }, {
            name: 'allLabs',
            type: 'scatter',
            //						data: ['1', '4', '-1',],
            data: [
                // [0.4, 1.5, 15],
                // [1, 2.3, 40],
                [0.16, 1.8],

            ],
            markArea: {
                silent: true,

            },
            itemStyle: {
                normal: {
                    // color:'#00a0e9'
                    color: 'rgb(0,160,233)'
                }
            },
            xAxisIndex: 0,
            yAxisIndex: 0
        },



        {
            type: 'line',
            xAxisIndex: 1,
            yAxisIndex: 1,
            data: ['', '', '', '', '', '', ''],
        },{
            type:'line',
            xAxisIndex:2,
            yAxisIndex:5,
            data:['2','-2'],//用于取到0的标线
            silent:true,
            lineStyle:{
                normal:{
                    opacity:0
                }
            },itemStyle:{
                normal:{
                    opacity:0
                }
            },
              markLine: {
                data: [{
                    type: 'average',
                    name: '',
                    symbol:'none'//起点标记的图形
                }],lineStyle:{
                    normal:{
                        type:'solid',
                    }
                },label:{
                    normal:{
                        show:false
                    }
                }
            }
        }, {
            type: 'bar',
            // data: ['', '2', '1.5', '1', '1', '1.5', '2', ''],
            // data: ['2', '2', '2', '2', '2', '2'],
            data: [{
                value: 0,
                itemStyle: {
                    normal: {
                        color: '#d6f1fc',
                    }
                }
            }, {//四分
                value: 2,
                itemStyle: {
                    normal: {
                        color: '#d6f1fc',
                        // borderColor:'#d6f1fc'
                    }
                }
            }, {
                value: 2,
                itemStyle: {
                    normal: {
                        color: '#d6f1fc',
                        // borderColor:'#d6f1fc'
                    }
                }
            }, {
                value: 2,
                itemStyle: {
                    normal: {
                        color: '#d6f1fc',
                        // borderColor:'#d6f1fc'
                    }
                }
            }, {
                value: 2,
                itemStyle: {
                    normal: {
                        color: '#d6f1fc',
                        // borderColor:'#d6f1fc'
                    }
                }
            }, {
                value: 0,
                itemStyle: {
                    normal: {
                        color: '#d6f1fc'
                    }
                }
            }],
            // data: ['', '', '', '', '', '', '', ]
            barGap: 0,
            barCategoryGap: 0,
            xAxisIndex: 0,
            yAxisIndex: 2,
            animation: false,
            silent: true,
            
        }, { //六分
            type: 'bar',
            // data: ['', '2', '1.5', '1', '1', '1.5', '2', ''],
            // data: ['', '1.5', '1.5', '1.5', '1.5', '', ],
            data: [{
                value: 0,
                itemStyle: {
                    normal: {
                    }
                }
            }, {
                value: 0,
                itemStyle: {
                    normal: {
                    }
                }
            }, {
                value: 0,
                itemStyle: {
                    normal: {
                    }
                }
            }, {
                value: 1.5,
                itemStyle: {
                    normal: {
                        color: '#92ddfc',
                        // borderColor:'#92ddfc'
                    }
                }
            }, {
                value: 1.5,
                itemStyle: {
                    normal: {
                        color: '#92ddfc',
                        // borderColor:'#92ddfc'
                    }
                }
            }, {
                value: 1.5,
                itemStyle: {
                    normal: {
                        color: '#92ddfc',
                        // borderColor:'#92ddfc'
                    }
                }
            }, {
                value: 1.5,
                itemStyle: {
                    normal: {
                        color: '#92ddfc',
                        // borderColor:'#92ddfc'
                    }
                }
            }, {
                value: 1.5,
                itemStyle: {
                    normal: {
                        color: '#92ddfc',
                        // borderColor:'#92ddfc'
                    }
                }
            }, {
                value:1.5,
                itemStyle: {
                    normal: {
                        color: '#92ddfc',
                        // borderColor:'#92ddfc'
                    }
                }
            }, {
                value: 0,
                itemStyle: {
                    normal: {
                    }
                }
            }, {
                value: 0,
                itemStyle: {
                    normal: {
                    }
                }
            }, {
                value: 0,
                itemStyle: {
                    normal: {
                    }
                }
            }],
            // data: ['', '', '', '', '', '', '', ]
            barGap: 0,
            barCategoryGap: 0,
            xAxisIndex: 0,
            yAxisIndex: 3,
            animation: false,
            silent: true,
        }, {
            type: 'bar',
            // data: ['', '2', '1.5', '1', '1', '1.5', '2', ''],
            // data: ['', '', '1', '1', '', '', ],
            data: [{
                value: 0,
                itemStyle: {
                    normal: {
                    }
                }
            }, {
                value: 0,
                itemStyle: {
                    normal: {
                    }
                }
            }, {
                value: 1,
                itemStyle: {
                    normal: {
                        color: '#37c7cf'
                        // ,borderColor:'#37c7cf'
                    }
                }
            }, {
                value: 1,
                itemStyle: {
                    normal: {
                        color: '#37c7cf',
                        // borderColor:'#37c7cf'
                    }
                }
            }, {
                value: 0,
                itemStyle: {
                    normal: {
                    }
                }
            }, {
                value: 0,
                itemStyle: {
                    normal: {
                    }
                }
            }],
            // data: ['', '', '', '', '', '', '', ]
            barGap: 0,
            barCategoryGap: 0,
            xAxisIndex: 0,
            yAxisIndex: 4,
            animation: false,
            silent: true,
        }
    ]
}
作品使用的第三方脚本

数据管理

历史数据 0 条

代码修改记录

信息提示

保存作品
