How to get an image to show on point selection or mouse over in a graph (image link in data table)

[#1]

Goal: to have the image display on point selection (or mouse over) in graph builder.
I do not want the data points to be represented by the image.

I have a column (Image Link 2) that is an expression and uses a formula.  The formula calls the web address of the image (Image Link).  The images show in the datatable in Image Link 2

This is the formula for Image Link 2.  Data Type is Expression.

New Image( Open( :Image Link, jpg ) )

 Image Link is something like the below.  It displays in quotes in the data table.  Data Type is character.  (I've also tried it as an expression).

https://www.wikipedia.org/portal/wikipedia.org/assets/img/Wikipedia-logo-v2.png

I've played with three things

1. Label / unlabel

2. Marker

3. Event handler

I thought this (Display Images on Hover Labels ) would work, making Image Link 2 Label, but it didn't work.

The closest I've gotten it to work is to set label to Image Link and put an Event Handler (the default one) on Image Link.

Function( {thisTable, thisColumn, iRow}, // 3 parameters
{ /* list of local variables, if needed */ },
// begin your code here
// this example is for URLs like https://www.jmp.com .
// You could build the URL from other columns and show
// a simpler ID in this column. You could also run a JMP
// platform instead of using the web() function.
Web( Char( thisTable:thisColumn[ iRow ] ) ); // open a web page
// end your code here
);

But on the graph it won't show the image it displays the text of the web address of the image.

Thank you.

[#2 · Accepted solution]

The expression column may need a formula that retrieves the image using Open() or New Image() (both seem to work).

Example:

dt = New Table("test",
    Add Rows(2),
    New Column("X", Numeric, Set Values([1, 2])),
    New Column("Y", Numeric, Set Values([1, 2])),
    New Column("URL",
        Character,
        Set Values(
            {"https://www.wikipedia.org/portal/wikipedia.org/assets/img/Wikipedia-logo-v2.png",
            "https://www.wikipedia.org/portal/wikipedia.org/assets/img/Wikipedia-logo-v2.png"}
        )
    ),
    New Column("Image", Expression, Formula(New Image(:URL))),
    Set Label Columns(:Image)
);

dt << Graph Builder(
    Show Control Panel(0),
    Variables(X(:X), Y(:Y)),
    Elements(Points(X, Y, Legend(11)))
);

[#3]

This is just an fyi for additional information:

• Open the sample data table Big Class Families.jmp run the attached Bivariate script. @ms solution is an example of this technique
• The JMP Scripting Guide version 14,  page 337, contains a script that shows how to store pictures as a thumbnail, and creates a handler to display the full picture. This is probably better for a scenario where a full display picture is desired.

[#4 · Accepted solution]

Thanks for the help.

I'm going to reply to my own thread here with what ultimately worked.  It was three steps.

To be clear, this enabled image display on mouse over.

[1] My URL column somehow had quotes like (sorry I didn't include that in the original post)

"https://www.wikipedia.org/portal/wikipedia.org/assets/img/Wikipedia-logo-v2.png"

Removing those

https://www.wikipedia.org/portal/wikipedia.org/assets/img/Wikipedia-logo-v2.png

  [2] Using the formula you provided worked much better than what I had

New Image( Open( :Image Link, jpg ) )

Instead following your example

New Image(:Image Link)

worked much better.

[3] Setting the column with the above formula to Label.

Thanks again.

[#5]

For JMP 15.0 we are evaluating a new feature called Graphlets which enables this behavior without the need to add a new column to the data table. All the logic stays in the graph, and you can build your URL from the contents of other columns (or from running a JMP Platform to get a preview of how it would look for the data associated with the hovered visual element).

The screenshot below is from one of my examples that uses the name of the species in the Iris dataset to fetch the corresponding picture from Wikipedia.

If you want to give this feature a try and provide us some feedback, please consider joining our Early Adopter program.

You can get more information from your Account Team.

Cheers,

  Nascif