echart 获取区间框选的像素

对于 ECharts 图表中的区间框选操作，可以通过绑定 `brushSelected` 事件来获取框选区域的像素坐标。具体实现方法如下：

myChart.on('brushSelected', function(params) {
  if (params.batch[0]) {
    var brushRect = params.batch[0].areas[0].coordRange;
    console.log(brushRect); // 打印框选区域的像素坐标
  }
});

在上述代码中，`myChart` 代表 ECharts 图表实例，`brushSelected` 事件会在区间框选时触发。在事件回调函数中，可以通过 `params.batch[0].areas[0].coordRange` 获取到框选区域的像素坐标。

相关问题

echart获取框选后的像素值

如果你想在 ECharts 中获取框选后的像素值，可以通过 `brushSelected` 事件和 `params` 参数来实现。具体步骤如下：

1. 在 ECharts 初始化时，可以通过 `brush` 属性来开启框选功能，示例代码如下：

   option = {
     // ... 其他配置
     brush: {
       toolbox: ['rect', 'polygon', 'lineX', 'lineY', 'keep', 'clear'],
       xAxisIndex: 0
     },
     // ... 其他配置
   };

在上述代码中，我们通过 `brush` 属性来启用框选功能，并设置了一些工具按钮和目标轴。

2. 注册 `brushSelected` 事件，获取框选的像素值，示例代码如下：

   myChart.on('brushSelected', function (params) {
     var brushComponent = params.brushComponents[0];
     var selectedRanges = brushComponent.selected;
     var xAxis = myChart.getModel().getComponent('xAxis', 0);
     var pixelStart = xAxis.axis.toGlobalCoord(selectedRanges[0][0]);
     var pixelEnd = xAxis.axis.toGlobalCoord(selectedRanges[0][1]);
     console.log('选择的像素范围为：', pixelStart, pixelEnd);
   });

在上述代码中，我们首先从 `params` 参数中获取到 `brushComponents` 数组，并通过 `brushComponents[0]` 获取到第一个刷选组件。然后从刷选组件中获取到 `selected` 数组，这个数组中保存了所有框选的区间范围。接下来，通过 ECharts 提供的 API `toGlobalCoord` 将区间范围转换为像素值。最后，我们将像素范围打印到控制台中。

需要注意的是，在上述代码中，我们只获取了第一个刷选组件，如果页面中存在多个刷选组件，你需要根据自己的需求修改代码。

echart 获取选中后的像素

要获取 ECharts 图表中选中数据的像素坐标，可以使用 `convertToPixel` 方法。该方法需要传入一个包含 x 和 y 坐标的数组作为参数，返回值也是一个包含 x 和 y 坐标的数组，表示选中数据的像素坐标。示例如下：

// 获取图表实例
var chart = echarts.init(document.getElementById('chart'));

// 监听选中事件
chart.on('click', function(params) {
  // 获取选中数据的像素坐标
  var pixel = chart.convertToPixel({gridIndex: 0}, [params.value[0], params.value[1]]);
  console.log('选中数据的像素坐标为：', pixel);
});

其中，`convertToPixel` 方法的第一个参数表示要获取像素坐标的坐标系，这里使用了 `gridIndex: 0`，表示获取第一个网格的像素坐标。第二个参数是一个数组，包含选中数据的 x 和 y 坐标。