Javascript 需要通过拖动鼠标在google散点图中选择点的范围

最近我开始研究谷歌图表。到目前为止还不错，但现在我面临着多重选择的问题。我可以通过鼠标点击选择多个点，但我需要通过拖动鼠标来选择点的范围

你能帮我一下吗

---

使用此答案绘制选择范围-->

使用图表方法-->

chart.getChartLayoutInterface（）.getBoundingBox（）

要查找每个点的边界

chart.getChartLayoutInterface（）.getBoundingBox（'point#0#0'）

其中，第一个

#0

表示序列列，
第二个

#0

表示行索引

如果边界在选择范围内，
将点添加到所选内容

请参阅以下工作片段

google.charts.load（'current'{
软件包：['corechart']
}).然后（函数（）{
var data=google.visualization.arrayToDataTable([
['x'，'y']，
[10, 15],
[15, 13],
[18, 20],
[24, 26],
[34, 30],
[40, 43],
[49, 48],
[50, 55],
[65, 67],
[70, 70],
[72, 70],
[73, 70],
[80, 85]
]);
var container=document.getElementById（'chart_div'）；
var chart=新的google.visualization.ScatterChart（容器）；
变量选项={
图表区：{
高度：“100%”，
宽度：“100%”，
前32名，
左：32，
右：16，
底数：32
},
高度：“100%”，
宽度：“100%”，
图例：{
位置：'顶部'
},
selectionMode:“多个”
};
google.visualization.events.addListener（图表'ready'，函数（）{
var chartLayout=chart.getChartLayoutInterface（）；
var divSelect=document.getElementById（'select_div'）；
var-x1=0；
变量y1=0；
var x2=0；
var y2=0；
var x3=0；
var y3=0；
var x4=0；
var y4=0；
函数reCalc（）{
x3=数学最小值（x1，x2）；
x4=数学最大值（x1，x2）；
y3=数学最小值（y1，y2）；
y4=数学最大值（y1，y2）；
divSelect.style.left=x3+'px'；
divSelect.style.top=y3+'px'；
divSelect.style.width=x4-x3+'px'；
divSelect.style.height=y4-y3+'px'；
}
函数selectPoints（）{
var选择=[]；
对于（var row=0；row如果（（point.left>=（x3-point.width））&&（（point.left+point.width）=（y3-point.height））&（（point.top+point.height）感谢WhiteHat:）。使用一个图表可以正常工作。如果我选择了多个图表，则会出现选择问题。在一个页面中，我几乎有七个图表，这些图表将根据百分比呈现。您能提供任何解决方案吗？感谢advancesee，请参阅上面的编辑，这几乎是相同的代码，只需要确定哪个图表首先被选中--当页面被滚动时，也更改了
selectPoints
功能…@whitehat这是香草JS的一个很好的解决方案-如果您有任何关于使用react google图表将其转换为react JS的提示，我们将不胜感激（这里的问题：）