Locating clicks

I am trying to display something (ultimately a menu) when point is clicked in a table DevExtreme

. I started by using a histogram for simplicity.

What do I want to do when the user clicks on the panel to display something else in the DOM at that particular point. I tried to fix this and got most of the path, the problem I have that I'm not sure how to solve is about coordinates.

enter image description here

The example above shows where I clicked and the red circle I added that appears at the top of the panel. The code to add is simple enough:

var clicked = function(p) {
 var element = p.element[0];
 var group = d3.select(element)
             .select("svg")
               .append("g")
               .attr("transform", "translate("+ [p.target.x, p.target.y] +")")
               .append("circle")
               .attr({ cx : 0, cy: 0, r: 10, class: "circle"});
};

      

Simple control of element coordinates with mouse click. Obviously this appears to be the top corner. Is there a way anyone can think of to get the actual location with a click?

I have a demo script unlocked from one of their examples: http://jsfiddle.net/IPWright83/ho2euurh/2/

+3


source to share


1 answer


Try this fiddle :

  .attr("transform", "translate("+ [p.jQueryEvent.pageX, p.jQueryEvent.pageY] +")")

      



This gives the coordinates of the clicked location.

+5


source







All Articles