nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Display image on hover (but not downloading image to table)

SamKing

Hi, I have some several GB files where I have a column, "link" to a unique image for that row.

Today I hover over a point and see my link and can click on it to open the image in a browser.

I've tried creating a new column "Image", labeled it, and set formula to

New Image(:link)

but this downloads every image then creates a ridiculously large file.

My goal is to hover over a point or click on a point in a graph builder and have it show the image (like a label'd item) instead of the link.

Is this possible? I'm using JMP18 pro.

Accepted answers

hogi

hi @SamKing , the template in Hover Label editor covers exactly this application case:

For your case it's':

Picture Box( Open( local:_link, jpg ) )

Don't forget the underscore!

For the column link, to make it accessible via the local Namespace of the Hover labels framework just activate the "label" option

All comments

jthi

To table you can do it event handler column property

And in a graph Hover Label is a good option BUT they can trigger quite a few times, and it might be a good idea download the image to the table when user hovers over a point to prevent re-downloading every time.

hogi

hi @SamKing , the template in Hover Label editor covers exactly this application case:

For your case it's':

Picture Box( Open( local:_link, jpg ) )

Don't forget the underscore!

For the column link, to make it accessible via the local Namespace of the Hover labels framework just activate the "label" option

hogi

For the Hover Label, it takes a while till it gets displayed - but the code of the Picture script is processed immediately.
So, you can speed up the approach by opening a new window with a Picture box and replacing the content with the loaded image.

new window("viewer", myNS:pb = Picture Box )

and in the picture script of the Hover Label :

myNS:pb << set image( ...

SamKing

This is what I was looking for and it is so simple! I have 2 follow-up questions, listed by importance.
1. Most of my plots in graph builder have a category on the top X-axis (Group X) so each section is a different framebox and depending on the dataset the number of frameboxes is very dynamic. When I use this method for hover, the script is attached to an individual framebox. Is there a way to make it attach to all of them, dynamically?
here is an example of my script where there are 4 frame boxes. If I remove the 4th then run the script then I don't get hover in that last box.:

Graph Builder(
	Size( 1284, 822 ),
	Show Control Panel( 0 ),
	Variables( X( :DFC ), Y( :Param1 ), Group X( :Param2 ) ),
	Elements( Smoother( X, Y, Legend( 6 ) ), Points( X, Y, Legend( 7 ) ) ),
	SendToReport(
		Dispatch( {}, "Graph Builder", FrameBox,
			{Set Graphlet( Picture( Picture Box( Open( local:_link, jpg ) ) ) )}
		),
		Dispatch( {}, "Graph Builder", FrameBox( 2 ),
			{Set Graphlet( Picture( Picture Box( Open( local:_link, jpg ) ) ) )}
		),
		Dispatch( {}, "Graph Builder", FrameBox( 3 ),
			{Set Graphlet( Picture( Picture Box( Open( local:_link, jpg ) ) ) )}
		),
		Dispatch( {}, "Graph Builder", FrameBox( 4 ),
			{Set Graphlet( Picture( Picture Box( Open( local:_link, jpg ) ) ) )}
		),
	)
);

2. Is there a way to specify the preview image size? And once I click the preview image then it opens the image in a new JMP window but my images are massive so I have to scroll around in the JMP window. Can this be set to size the image?

SamKing

Hi, I do have that already setup on my :link column but I use that just to create the hyperlink that shows up as a label. So I can click on that to take me to a browser to see the image. But it doesn't show me a preview of the image, only the link.

mmarchandFSLR

This will set the graphlet for all frame boxes in the report.

gb = Graph Builder(
	Size( 1284, 822 ),
	Show Control Panel( 0 ),
	Variables( X( :DFC ), Y( :Param1 ), Group X( :Param2 ) ),
	Elements( Smoother( X, Y, Legend( 6 ) ), Points( X, Y, Legend( 7 ) ) )
);
(Report( gb ) << X Path( "//FrameBox" )) << Set Graphlet( Picture( Picture Box( Open( local:_link, jpg ) ) ) );