Javascript 如何获得X&;的起点;条形图中条形的Y

Javascript 如何获得X&;的起点;条形图中条形的Y,javascript,jquery,fusioncharts,Javascript,Jquery,Fusioncharts,我有一个条形图,我在其中调用一个javascript函数,在鼠标点击条形图时执行一些操作,我想得到我点击的同一条条形图的X&Y轴的起点,我可以在fusion图表中这样做吗,如果是,如何做 我用黄色突出显示,我需要根据屏幕显示这些位置。是的,当您单击条形图时,您可以获得图表尺寸的x和y坐标 您需要使用FusionCharts“dataPlotClick”事件API,该API在单击绘图上的任意位置时触发。然后,在事件函数参数中,可以使用预定义的属性“chartX”和“chartY”获取单击点的x和

我有一个条形图,我在其中调用一个javascript函数,在鼠标点击条形图时执行一些操作,我想得到我点击的同一条条形图的X&Y轴的起点,我可以在fusion图表中这样做吗,如果是,如何做


我用黄色突出显示,我需要根据屏幕显示这些位置。

是的,当您单击条形图时,您可以获得图表尺寸的x和y坐标

您需要使用FusionCharts“dataPlotClick”事件API,该API在单击绘图上的任意位置时触发。然后,在事件函数参数中,可以使用预定义的属性“chartX”和“chartY”获取单击点的x和y坐标

请查看文档链接以获取参考:

还可以找到一个提琴样本供参考:


你有活生生的例子吗?基本上,您可以通过单击
event.target.getBoundingRect()
方法获得html块的位置和维度。因此,您所需要的只是获得一个正确的元素,它看起来像是使用SVG的融合图表,并且它在属性中已经有了位置(可能需要一些静态转换)。读一下:我得到了鼠标点击的位置,但当鼠标点击开始时,我只能得到正确的位置。你能在jsbin或类似的地方设置一个实例吗?
FusionCharts.ready(function() {
var revenueChart = new FusionCharts({
type: 'bar2d',
renderAt: 'chart-container',
width: '500',
height: '350',
dataFormat: 'json',
dataSource: {
  "chart": {
    "caption": "Monthly revenue for last year",
    "subCaption": "Harry's SuperMart",
    "xAxisName": "Month",
    "yAxisName": "Revenue (In USD)",
    "numberPrefix": "$",
    "paletteColors": "#0075c2",
    "bgColor": "#ffffff",
    "borderAlpha": "20",
    "canvasBorderAlpha": "0",
    "usePlotGradientColor": "0",
    "plotBorderAlpha": "10",
    "placevaluesInside": "1",
    "rotatevalues": "1",
    "valueFontColor": "#ffffff",
    "showXAxisLine": "1",
    "xAxisLineColor": "#999999",
    "divlineColor": "#999999",
    "divLineIsDashed": "1",
    "showAlternateHGridColor": "0",
    "subcaptionFontBold": "0",
    "subcaptionFontSize": "14"
  },
  "data": [{
    "label": "Jan",
    "value": "420000"
  }, {
    "label": "Feb",
    "value": "810000"
  }, {
    "label": "Mar",
    "value": "720000"
  }, {
    "label": "Apr",
    "value": "550000"
  }, {
    "label": "May",
    "value": "910000"
  }, {
    "label": "Jun",
    "value": "510000"
  }, {
    "label": "Jul",
    "value": "680000"
  }, {
    "label": "Aug",
    "value": "620000"
  }, {
    "label": "Sep",
    "value": "610000"
  }, {
    "label": "Oct",
    "value": "490000"
  }, {
    "label": "Nov",
    "value": "900000"
  }, {
    "label": "Dec",
    "value": "730000"
  }]
},
"events": {
  "dataPlotClick": function(eventObj, dataObj) {
    alert("X : " + eventObj.data.chartX + ", Y : " + eventObj.data.chartY);
  }
}
}).render();
});