Highlight color change for different condition
How do I change the area map color for different condition when the area is already highlighted?
This is my code:
if(partyname = "Democrat")
{
var data = $('#MT').data('maphilight') || {fillColor:'ff0000'};
data.alwaysOn = !data.alwaysOn;
$('#MT').data('maphilight', data).trigger('alwaysOn.maphilight');
}
if(partyname = "Republican")
{
var data = $('#MT').data('maphilight') || {fillColor:'000000'};
data.alwaysOn = !data.alwaysOn;
$('#MT').data('maphilight', data).trigger('alwaysOn.maphilight');
}
I am using jquery.maphighlight.min.js
jQuery plugin for highlighting the map.
My problem is that the area is highlighted by red color with the first button. If I clic开发者_开发百科k the second button, the same area is highlighted but the color cannot be changed (the color should be changed to black).
For starters, try replacing "colorToHightlight" with colorToHighlight so you call the correct variable that you named earlier.
Something like:
Jquery:
var colorToHighlight = "black" //default
$("#color_options a").click(function (e)
{
e.preventDefault(); //stop the anchor tag
colorToHighlight = $(this).attr("id");
}
/*
Do the highlight stuff
*/
HTML:
<div id="color_options">
<a href="#" id="green">Green</a> - <a href="#" id="red">Red</a>
</div>
We used the alt attribute to hold the colour.
HTML:
<p><a href="#" class="aToggle" alt="37ee8d">Go GREEN</a></p>
JS/JQuery:
$('.aToggle').click(function (e) {
var data = $('#area1').mouseout().data('maphilight') || {};
data.fillColor = $(this).attr('alt');
$('#area1').data('maphilight', data).trigger('alwaysOn.maphilight');
});
Where "area1" is the map area.
精彩评论