cancel
Showing results for 
Search instead for 
Did you mean: 

adding a Clickable picture wich enlarges at mouse-over in your Dashboard?

Former Member
0 Kudos

I want to add a Clickable picture which enlarges at mouse-over

For example, if you hover on the factory-map several parts of the factory are outlined and zoomed a little bit to emphasis what you are looking at.

You can easily create this by using dynamic visibilty and showing enlarged pictures on where your mouse is located when you hover over a transparant icon component

I now want to create transparant buttons on my dashboard which lead to Source and Destinations so I can show a KPI corresponding to the part of the picture the user clicked...
But then things stop working...
 
If I set the button ON TOP (move to front) the button still works but the flashy activity (zoom when you hover on the picture) stops working.
 
If I set the button to the BACK, the flashy activity of the picture (outline and zoom when you hover on the picture) is working, but the button functionality is not working
 
Is there a way to get BOTH WORKING... so hovering over my picture and showing a enlarged picture and also a clickable button??

Accepted Solutions (1)

Accepted Solutions (1)

former_member184839
Active Contributor
0 Kudos

Hi Bob

As mentioned above, "Fish Eye Picture Menu" ll work perfectly for this. It enlarges the image on mouse over and also allows the user to click on a particular image.

For the zoomed image after clicking , you can have the Labels(of images) in one column and their links in the next column. This ll be your source of "Fish Eye Picture Menu".
For the Zoomed in image you can go with the Swf loader/Slide Show component . The destination of the "Fish Eye Picture Menu" ll be the source to these.

Such way if u click an image on "Fish Eye Picture Menu", the zoomed image can be displayed in the  Swf loader/Slide Show component.

Thanks,

Sara

Former Member
0 Kudos

The fish eye pictue menu object (like you suggested) is NOT going to work since it contains a background and 2 borders which you cannot delete.

I want JUST a clickable picture, nicely fitted to the background, no horrible (colored) backgrounds or disturbing borders

But I found a resolution, it's a bit quirky but it works in my situation (a blue print of a factory with 5 points on it which you want to enlarge)

What I did is the following

1. First place the picture (in my case blue print of factory) on your canvas

2 place a XY chart on top of that. Make sure every visible item for that map is turned of , so NO background, no grid-lines, no axes, no titles, etc etc

3. Adjust the XY chart so that it covers the picture (1)(both same size)

4. set the min-max scale on 10 (for Y and X ax) and plot the points on your map

so let's say first enlarge point is x:1 y: 9 (upper left corner). And put those points in your excel sheet.

5. Make sure marker size is set to appropriate size (so it covers the area which needs to be enlarged.

6. And if every thing fits nice then also set transperancy of the markers to 100% (they dissapear)_

7. Set Insertion - Data Insertion , and map to you XY values in your excel sheet, and set insert On mouse over to a specific location, Default selection: Item: No selection (-1)

8. Place the enlarge pictures of your choice on the canvas and show them only if the mouse over is setting the correct value.

The only thing which you cannot solve is the fact that the enlarged (bigger) picture will stay big until you hit another mouse-over point on your picture... but that's not really disturbing

Answers (1)

Answers (1)

former_member212706
Participant
0 Kudos

Dear Bob,

Please try using a fish eye picture menu component. I guess it will satisfy your requirement.

Thanks,

Rajesh.