Question

我们正在尝试使用HighMaps让用户选择多个区域。如果用户单击然后在按住SHIFT键的同时单击其他区域，则效果很好。在HighCharts中，我们可以使用可拖动的框来选择多个点（例如散点图中）。我想允许这种类似的拖动在HighMaps中选择选项。一个简单的例子是here。这不起作用。

我认为解决方案涉及鼠标悬停效果。这样，当鼠标光标进入该区域时，整个区域就会突出显示。如果我可以根据自己的目的修改此代码，以使可拖动的框范围也将触发悬停。

chart: {
  events: {
    selection: function(event) {
      for (var i = 0; i < this.series[0].data.length; i++) {
        var point = this.series[0].data[i];
        if (point.x > event.xAxis[0].min &&
          point.x < event.xAxis[0].max &&
          point.y > event.yAxis[0].min &&
          point.y < event.yAxis[0].max) {
          point.select(true, true);
        }
      }
      return false;
    }
  },
  zoomType: 'xy'
},

Answer 1

您需要比较正确的x和y值：

events: {
    selection: function(event) {
        for (var i = 0; i < this.series[0].data.length; i++) {
            var point = this.series[0].data[i],
                xAxis = event.xAxis[0],
                yAxis = event.yAxis[0];

            if (point.graphic) {
                if (point._minX > xAxis.min &&
                    point._maxX < xAxis.max &&
                    point._minY > yAxis.min &&
                    point._maxY < yAxis.max) {

                    point.select(true, true);
                }
            }
        }
        return false;
    }
}

实时演示： https://jsfiddle.net/BlackLabel/m4ubd0z2/

如何通过在HighMaps中拖动选择框来获取多个区域

1 个答案: