> I would like to be able to click to identify points on a scatterplot. Has any work been done related to this?
No, this is not done yet. It should not be too hard, but I never got round to it. You may be able to hack it. As Brian suggests, this would be straightforward in d3, and I am interested in making a d3 version of plot. On 28 October 2015 at 07:15, Joe Bogner <[email protected]> wrote: > I would like to be able to click to identify points on a scatterplot. > Has any work been done related to this? > > In the example below, we can see that 'c' appears to be an outlier. It > would be convenient to be able to click on the point and identify it > somehow. > > There is a hack to identify the coordinates, but it doesn't work very well: > > > http://www.jsoftware.com/jwiki/AndrewNikitin/plothacks?highlight=%28plot%29%7C%28click%29 > > Try clicking in the upper right, and provides the exact coordinate > which would take some work to identify in the underlying dataset. > > If nothing new has been done on this topic, I'm considering looking > into hacking the canvas output > > Here is an example: > > strToTable =: (< @ (".^:(#@".)) ) ;._2@,&' ';._2 > data=: strToTable 0 : 0 > a 5 10 > b 7 12 > c 10 50 > d 8 15 > ) > > 'x y' =. > |: }."1 data > > pd 'reset' > pd 'type dot' > pd 'pensize 5' > pd x;y > pd 'show' > > > > > proof of concept canvas hack > > In the javascript generated: > > function graph() { > var graphCanvas = document.getElementById('canvas1'); > // ensure that the element is available within the DOM > if (graphCanvas && graphCanvas.getContext) { > // open a 2D context within the canvas > var context = graphCanvas.getContext('2d'); > // draw > > //BEGIN NEW > var pts = drawPlot(context); > function windowToCanvas(canvas, x, y) { > var bbox = canvas.getBoundingClientRect(); > > return { x: x - bbox.left * (canvas.width / bbox.width), > y: y - bbox.top * (canvas.height / bbox.height) > }; > } > > graphCanvas.onmousedown = function (e) { > var xy = windowToCanvas(graphCanvas, e.clientX, e.clientY); > for(var i = 0; i < pts.length; i++) { > var radius=4; > var dx = xy.x-pts[i][0]; > var dy = xy.y-pts[i][1]; > var isHit = (dx*dx+dy*dy)<(radius*radius); > if (isHit) { > console.log([i, pts[i][0], pts[i][1]]); > } > } > console.log(xy); > } > //END NEW > } > > > Where the points get added: > > var pts=[]; > pts.push([29.5,332]) > pts.push([201.5,316.4]) > pts.push([459.5,20]) > pts.push([287.5,293]) > for(var i = 0; i < pts.length; i++) { > > ctx.beginPath();ctx.arc(pts[i][0],pts[i][1],4,0,2*Math.PI,1);ctx.fill();ctx.closePath(); > } > return pts; > > Instead of: > > ctx.beginPath();ctx.arc(29.5,332 > ,4,0,2*Math.PI,1);ctx.fill();ctx.closePath(); > > ctx.beginPath();ctx.arc(201.5,316.4,4,0,2*Math.PI,1);ctx.fill();ctx.closePath(); > ctx.beginPath();ctx.arc(459.5,20 > ,4,0,2*Math.PI,1);ctx.fill();ctx.closePath(); > ctx.beginPath();ctx.arc(287.5,293 > ,4,0,2*Math.PI,1);ctx.fill();ctx.closePath(); > > > The nice thing about using canvas would be that it is supported on jqt and > jhs > > Thanks > Joe > ---------------------------------------------------------------------- > For information about J forums see http://www.jsoftware.com/forums.htm > ---------------------------------------------------------------------- For information about J forums see http://www.jsoftware.com/forums.htm
