Thanks to everyone who supplied ideas on the plot_gs_mbldbl_jwplot_ hack. I ended up implementing a canvas hack which can be seen here: http://code.jsoftware.com/wiki/User:Joe_Bogner/CanvasDotHoverHack
On Wed, Oct 28, 2015 at 11:11 AM, chris burke <cbu...@jsoftware.com> wrote: >> 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 <joebog...@gmail.com> 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 ---------------------------------------------------------------------- For information about J forums see http://www.jsoftware.com/forums.htm
