Try Dragging these Pointsecharts 配置项内容和展示

格子背景

      option = {
    "legend": {
        "data": ["长沙市"],
        "top": 30
    },
    "series": [{
        "data": ["217", "270", "285", "300", "268", "271", "251", "230", "230", "226", "219", "212", "189", "142", "124", "129", "137", "139", "147", "159", "185", "202", "202", "183", "160", "147", "138", "127", "115", "100", "87", "78", "70", "67", "73", "75", "67", "60", "58", "58", "59", "63", "73", "97", "117", "138", "160", "176", "149", "127", "103", "90", "140", "165", "175", "170", "153", "145", "159", "172", "176", "147", "123", "108", "82", "60", "50", "38", "30", "28", "28", "25", "19", "19", "19", "19", "19", "19", "18", "18", "18", "16", "16", "16", "16", "16", "14", "14", "14", "14", "13", "13", "14", "14", "14", "15", "15", "16", "20", "30", "38", "33", "28", "28", "29", "29", "30", "33", "39", "42", "38", "33", "32", "30", "32", "29", "28", "26", "23", "22"],
        "markLine": {
            "animation": false,
            "symbol": "none",
            "linStyle": {
                "type": "soild",
                "width": 4
            },
            "data": [{
                "name": "优",
                "yAxis": 50,
                "itemStyle": {
                    "normal": {
                        "color": "#B3FFB3"
                    }
                }
            }, {
                "name": "良",
                "yAxis": 100,
                "itemStyle": {
                    "normal": {
                        "color": "#FFFFB3"
                    }
                }
            }, {
                "name": "轻度污染",
                "yAxis": 150,
                "itemStyle": {
                    "normal": {
                        "color": "#F5AF67"
                    }
                }
            }, {
                "name": "中度污染",
                "yAxis": 200,
                "itemStyle": {
                    "normal": {
                        "color": "#FC2E43"
                    }
                }
            }, {
                "name": "重度污染",
                "yAxis": 300,
                "itemStyle": {
                    "normal": {
                        "color": "#cc00cc"
                    }
                }
            }, {
                "name": "严重污染",
                "yAxis": 400,
                "itemStyle": {
                    "normal": {
                        "color": "#990000"
                    }
                }
            }],
            "label": {
                "normal": {
                    "show": true,
                    "formatter": "{b}"
                }
            }
        },
        "name": "长沙市",
        "symbolSize": 8,
        "type": "line"
    }],
    "title": {
        "text": "AQI时间演变图",
        "textStyle": {
            "fontSize": 22
        },
        "x": "center",
        "y": "top"
    },
    "tooltip": {
        "show": true,
        "trigger": "axis"
    },
    "xAxis": [{
        "axisLine": {
            "onZero": false
        },
        "boundaryGap": false,
        "data": ["05日\n00时", "05日\n01时", "05日\n02时", "05日\n03时", "05日\n04时", "05日\n05时", "05日\n06时", "05日\n07时", "05日\n08时", "05日\n09时", "05日\n10时", "05日\n11时", "05日\n12时", "05日\n13时", "05日\n14时", "05日\n15时", "05日\n16时", "05日\n17时", "05日\n18时", "05日\n19时", "05日\n20时", "05日\n21时", "05日\n22时", "05日\n23时", "06日\n00时", "06日\n01时", "06日\n02时", "06日\n03时", "06日\n04时", "06日\n05时", "06日\n06时", "06日\n07时", "06日\n08时", "06日\n09时", "06日\n10时", "06日\n11时", "06日\n12时", "06日\n13时", "06日\n14时", "06日\n15时", "06日\n16时", "06日\n17时", "06日\n18时", "06日\n19时", "06日\n20时", "06日\n21时", "06日\n22时", "06日\n23时", "07日\n00时", "07日\n01时", "07日\n02时", "07日\n03时", "07日\n04时", "07日\n05时", "07日\n06时", "07日\n07时", "07日\n08时", "07日\n09时", "07日\n10时", "07日\n11时", "07日\n12时", "07日\n13时", "07日\n14时", "07日\n15时", "07日\n16时", "07日\n17时", "07日\n18时", "07日\n19时", "07日\n20时", "07日\n21时", "07日\n22时", "07日\n23时", "08日\n00时", "08日\n01时", "08日\n02时", "08日\n03时", "08日\n04时", "08日\n05时", "08日\n06时", "08日\n07时", "08日\n08时", "08日\n09时", "08日\n10时", "08日\n11时", "08日\n12时", "08日\n13时", "08日\n14时", "08日\n15时", "08日\n16时", "08日\n17时", "08日\n18时", "08日\n19时", "08日\n20时", "08日\n21时", "08日\n22时", "08日\n23时", "09日\n00时", "09日\n01时", "09日\n02时", "09日\n03时", "09日\n04时", "09日\n05时", "09日\n06时", "09日\n07时", "09日\n08时", "09日\n09时", "09日\n10时", "09日\n11时", "09日\n12时", "09日\n13时", "09日\n14时", "09日\n15时", "09日\n16时", "09日\n17时", "09日\n18时", "09日\n19时", "09日\n20时", "09日\n21时", "09日\n22时", "09日\n23时"],
        "interval": 23,
        "type": "category"
    }],
    "yAxis": [{
        "axisLine": {
            "show": true
        },
        "min": 0,
        //"max": 400,
        "name": "",
        "scale": false,
        "type": "value",
        "minInterval": 50,
        "interval": 50,
        "splitArea": {
            "show": true,
            "areaStyle": {
                "color": ["#B3FFB3", "#FFFFB3", "#F5AF67", "#FC2E43", "#cc00cc", "#cc00cc", "#990000", "#990000", "#990000", "#990000", "#990000", "#990000"]
            }
        }
    }]
}