1. 程式人生 > >Echarts自定義圖表顯隱開關

Echarts自定義圖表顯隱開關

class from data station AS 動態 option toc for

  1. 插入折線
    // 插入折線
    function appendLineToChart(name, data, zeroData) {
        var line = {
            name: name,
            type: ‘line‘,
            xAxisIndex: 0,
            smooth: false,
            connectNulls: true,
            data: data,
            markLine: {
                lineStyle: {
                    type: ‘dashed‘
                },
                data: zeroData
            }
        }
        option.series.push(line);
        chart.setOption(option);
    }

  2. 清除折線
    function removeLineFromChart(name) {
        var index = -1;
        for (var i = 0; i < option.series.length; i++) {
            if (option.series[i].name == name) {
                index = i;
                break;
            }
        }
    
        if (index > -1) {
            option.series.splice(index, 1);
            chart.setOption(option, 
    true); // 設置option不合並(覆蓋)
    } }

  3. 對於其中的交互和傳值可以動態的去創建對象
    function parseSkData(skData, dataInfo) {
    
        var skTime = dataInfo.time;
        var skAgingType = dataInfo.skAgingType;
        var fileName = getSKFileName(skTime, skAgingType);
    
        data = skData["stationDataList"];
    
        var Station = {};
    
        Station[fileName + ‘:tmp‘] = new Array();
        Station[fileName + ‘:dp‘] = new Array();
        Station[fileName + ‘:tmp_zero‘] = null;
    
    
        
    if (!(data == null || data == undefined || data == ‘‘)) { /*獲取折線折點*/ for (var i = 0; i < data.length; i++) { var line = data[i]; var _dew = line.dew; var _height = line.height; var _hpa = line.hpa; var _tmp = line.tmp; var _winDir = line.winDir; var _winSpeed = line.winSpeed; _dew = _dew == 9999 ? ‘-‘ : _dew; _height = _height == 9999 ? ‘-‘ : _height; _hpa = _hpa == 9999 ? ‘-‘ : _hpa; _tmp = _tmp == 9999 ? ‘-‘ : _tmp; _winDir = _winDir == 9999 ? ‘-‘ : _winDir; _winSpeed = _winSpeed == 9999 ? ‘-‘ : _winSpeed; Station[fileName + ‘:tmp‘][i] = new Array(_tmp, _hpa); Station[fileName + ‘:dp‘][i] = new Array(_dew, _hpa); } Station[fileName + ‘:tmp_area_data‘] = []; Station[fileName + ‘:tmp_zero‘] = calcZero(data, ‘tmp‘, Station[fileName + ‘:tmp_area_data‘]); /*計算冷暖層強度*/ if (Station[fileName + ‘:tmp_zero‘].length > 1) { Station[fileName + ‘:tmp_areas‘] = []; Station[fileName + ‘:tmp_areas‘] = calAreas(Station[fileName + ‘:tmp_area_data‘]); } } return Station; }

Echarts自定義圖表顯隱開關