cancel
Showing results for 
Show  only  | Search instead for 
Did you mean: 

Discussions

Solve problems, and share tips and tricks with other JMP users.
Choose Language Hide Translation Bar
lala
Level IX

How to achieve the effect of the cursor pointing to the displayed content on a web page using JSL in JMP?

Thanks Experts!


http://worldmap.ifnews.com/chinamap/china/fmap

h = [=>];
h["User-Agent"] = "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36";
h["Accept"] = "application/json, text/javascript, */*; q=0.01";
h["Referer"] = "http://worldmap.ifnews.com/chinamap/china/fmap";
h["X-Requested-With"] = "XMLHttpRequest";
u = "http://worldmap.ifnews.com/chinamap/china/financialData?type=all";
rs = New HTTP Request(URL(u), Method("GET"), Headers(h));
rr = rs << Send;
If( !Is Missing( rr ),
	txt = Blob To Char( rr );
	dt = JSON To Data Table( txt );
	dt << Set Name( "map" );
	dt:price << Data Type( Numeric ) << Modeling Type( Continuous );
	dt:priceLimit << Data Type( Numeric ) << Modeling Type( Continuous );
	dt:changeAmount << Data Type( Numeric ) << Modeling Type( Continuous );
	dt:countryCName << Set Property( "Map Role", {Map Role( NameName, Map Name( "World", "Countries" ) )} );
	dt << Graph Builder(
		Size( 800, 600 ),
		Show Control Panel( 0 ),
		Variables( Shape( :countryCName ), Color( :priceLimit ) ),
		Elements( Map Shapes( Legend( 5 ) ) ),
		SendToReport(
			Dispatch(
				{},
				"400",
				ScaleBox,
				{Legend Model(
					5,
					Properties(
						0,
						{gradient(
							{Color Theme( "Red to Green" ), 
							Reverse Gradient( 1 )} 
						)},
						Item ID( "priceLimit", 1 )
					)
				)}
			)
		)
	);
);

2026-01-10_10-33-59.png

6 REPLIES 6
jthi
Super User

Re: How does the JSL of MP software achieve this effect on web pages

Which effect? Which web pages?

-Jarmo
lala
Level IX

Re: How does the JSL of MP software achieve this effect on web pages

How to achieve the effect of the cursor pointing to the displayed content on a web page using JSL in JMP?
http://worldmap.ifnews.com/chinamap/china/fmap2026-01-10_15-38-22.png

When the cursor points to a certain country range on the map, data pops up
Thanks!

hogi
Level XIII

Re: How does the JSL of MP software achieve this effect on web pages

In JMP, this function is implemented via Hover Labels:

hogi_0-1768032965584.png

 

if you need a faster update - and maybe don't like the appearance of the Hoverlabel Box, then you can use mousetrap.
For further details, see  @Craige_Hales  response to a similar question:
 https://community.jmp.com/t5/Discussions/Can-JMP-graphics-have-this-effect/m-p/810221/highlight/true...

hogi
Level XIII

Re: How does the JSL of MP software achieve this effect on web pages

As an alternative, you can edit the "Picture" script of the HoverLabel - to trigger any action you want:

- open a web page
- display further information in the graph
- open another plot ...

Further details can be found in this post:
Re: actions via mouseover ? - us a modifier Key :backhand_index_pointing_right::white_square_button: 

 

The benefit of this approach:
the Hoverlabel knows the country of the current mouse position, no need to look it up:

:Country[local:_firstrow]

 

 

hogi
Level XIII

Re: How does the JSL of MP software achieve this effect on web pages

 

Names Default To Here( 1 );
dt = Open( "$SAMPLE_DATA/World Demographics.jmp" );

mapxy = Open( "$MAPS/World-XY.jmp" );
mapname = Open( "$MAPS/World-Name.jmp" );
mapname << New Column( "X", Format( "Longitude DDD", "PUNDIR", 14, 4 ) );
mapname << New Column( "Y", Format( "Latitude DDD", "PUNDIR", 14, 4 ) );

For Each( {rw}, Index( 1, N Rows( mapname ) ),
	shapeID = mapName:ShapeID[rw];
	rws = mapxy << get rows where( :ShapeID == shapeID & :PartID == 1 );
	xs = mapxy[rws, "X"];
	ys = mapxy[rws, "Y"];
	{x, y} = Polygon Centroid( xs, ys );
	mapname:x[rw] = x;
	mapname:y[rw] = y;
);

dt << Update( With( mapname ), Match Columns( :Territory = :Region ), Add Columns from Update Table( :X, :Y ) );

New Namespace(
	"hover"
);
hover:GDP = 0;
hover:x = 0;
hover:y = 0;
gb = Graph Builder(
	Variables( Color( :GDP per Capita ), Shape( :Territory ) ),
	Elements( Map Shapes() ),
	SendToReport(
		Dispatch( {}, "", ScaleBox,
			{Format( "Longitude DDD", "PUNDIR", 16 ), Min( 0 ), Max( 30 )}
		),
		Dispatch( {}, "", ScaleBox( 2 ),
			{Format( "Latitude DDD", "PUNDIR", 16, 0 ), Min( 40 ), Max( 50 )}
		),
		Dispatch( {}, "Graph Builder", FrameBox,
			{Set Graphlet(
				Picture(
					hover:GDP = :GDP per Capita[local:_firstrow];
					hover:x = :X[local:_firstrow];
					hover:y = :y[local:_firstrow];
//approach1: select the current country and trigger an update -> nice, but draggy
//local:_dataTable << Clear Select << select rows(local:_firstrow);
					gb << inval;
					gb << updatewindow;

		
				)
			)}
		)
	)
);

fb1 = Report( gb )[FrameBox( 1 )];
fb1 << addgraphicsscript(
	x = hover:x;
	y = hover:y;
	Text( center justified, {hover:x, hover:y}, "GDP:  " || Char( Round( hover:GDP ) ) );
);

 

Does Hover Label know the current position of the mouse?
unfortunately, local:_xaxis/_yaxis =0.

As a workaround I used this approach 
https://community.jmp.com/t5/Discussions/exporting-x-amp-y-values-coordinates-from-graph-builder-onc... @johnmoore  to calculate the centroid of the country - to show the GDP.

As an alternative, one can use Mousetrap (in addition to the Hover Label workaround) to get the position of the mouse.
The disadvantage: less interactive as the user has to press the mouse button.

lala
Level IX

Re: How does the JSL of MP software achieve this effect on web pages

Thanks Experts!2026-01-10_20-26-18.png

Recommended Articles