用ngx-echarts从平行坐标图中求取所选值

Question

我很难让这些事件在我的图表上进行。我需要得到我的平行坐标图的选定区域的值。我尝试使用chartDataRangeSelected，但当我选择一些数据时，它什么也不做。

这是我的密码：

<div echarts [options]="chartOption" class="demo-chart" (chartInit)="onChartInit($event)" (chartDataRangeSelected)="onChartSelect($event)"></div>

图表配置：

chartOption: EChartOption = {
    title: {
        text: 'Demo Parallel Coordinates',
        subtext: 'data from macrofocus',
        left: 'center',
        top: 5,
        itemGap: 0,
        textStyle: {
            color: '#000000'
        },
        z: 200
    },
    parallelAxis: this.makeParallelAxis(this.schema),
    grid: [{
        show: true,
        left: 0,
        right: 0,
        top: '0',
        bottom: 0,
        borderColor: 'transparent',
        backgroundColor: 'white',
        z: 99
    }],
    parallel: {
        top: '10%',
        left: 100,
        right: 100,
        bottom: 100,
        axisExpandable: true,
        axisExpandCenter: 15,
        axisExpandCount: 10,
        axisExpandWidth: 60,
        axisExpandTriggerOn: 'mousemove',

        z: 100,
        parallelAxisDefault: {
            type: 'value',
            nameLocation: 'start',
            nameRotate: 25,
            // nameLocation: 'end',
            nameTextStyle: {
                fontSize: 12
            },
            nameTruncate: {
                maxWidth: 170
            },
            nameGap: 20,
            splitNumber: 3,
            tooltip: {
                show: true
            },
            axisLine: {
                // show: false,
                lineStyle: {
                    width: 1,
                    color: '#000000'
                }
            },
            axisTick: {
                show: false
            },
            splitLine: {
                show: false
            },
            z: 100
        }
    },
    series: [
        {
            name: 'parallel',
            type: 'parallel',
            smooth: true,
            lineStyle: {
                color: '#577ceb',
                width: 0.5,
                opacity: 0.6
            },
            z: 100,
            data: this.rawData
        }
    ]
};

功能：

onChartSelect(e){
    console.log(e);
  }

我这样做是否使用了正确的事件？你的帮助将不胜感激。

谢谢

Answer 1

根据eCharts文件，

在visualMap中更改范围后发出的selectDataRange事件。https://www.echartsjs.com/en/api.html#events.datarangeselected，

它是ngx映射到的chartDataRangeSelected。

您可以看到，这是一个与visualMap相关的事件。您的图表根本没有视觉地图，所以我想事件不会被触发。

您可以尝试chartAxisAreaSelected，因为这与您的图表更相关。