2

I've created an image map using the code:

$('img').mapster({
   staticState: true
})

All areas are selected at once and visible. Is there any way, any method I could hide/disable some areas so that they wouldn't be visible ? I would like to filter areas on some conditions.

I know that I can remove 'area' tag or href atribute from javascript level and then call the above code once more (once again recreate imagemapster) but is there any more elegant and smarter way ? Maybe there is some build-in plugin solution but I couldn't find that.

Thank you for any help. Kind Regards Marcin

Marcin Wasik
  • 100
  • 7

1 Answers1

0

I suggest you to change to 

$('img').mapster({
    selected: true,
    isSelectable: false, // can't change of state by simple click
    isDeselectable: false, // can't change of state by simple click
})

you can still bind the onClick callback on all the areas.

once you decide which areas you don't want, you can set the individual state via 

$("#id_of_area").mapster('set',false);

or from the map id

$("img").mapster('set',false,'key or string of keys to deselect');

it seems staticState is just for show, and doesn't set everything to a selected state... ( I tried some combinations and had weird results like making it darker like on selected+highlight)

Something like this http://jsfiddle.net/Wvzgj/529/

Ryu
  • 172
  • 6
  • Thanks for reply, but it doesn't behave as I want. When you hide an area by: $("img").mapster('set',false,'key or string of keys to deselect'); it's highlighted when you hover it. I'd like to "hide" it completely, in every state. – Marcin Wasik Nov 17 '15 at 09:41
  • you can try setting the highlight opacity to 0, like here: http://jsfiddle.net/Wvzgj/529/ check area 75 and 77 (Colorado & Oregon) both are disable and no more highlight... – Ryu Nov 17 '15 at 22:52