Let's say I have this map:
<map name="diffmap1" id="diffmap1" class="myMap">
<area shape="poly" coords="152,347,253,292,264,307,167,358" class="diff diff1">
<area shape="poly" coords="93,244,164,215,171,233,97,264" class="diff diff2">
</map>
and jquery:
$('.diff').click(function(e){
//code here
});
How can I calculate the maximum height and width of each polygon?
I feel like I'm helping you a lot these time ;-)
So you have this :
<area shape="poly" coords="152,347,253,292,264,307,167,358" class="diff diff1">
and you know that coords are like "x1,y1,x2,y2[...]" so you must put every x in one array and every y in another array. Then, process =)
var x = [];
var y = [];
// string value of the attribute coord :
var coord = $(".diff1").attr('coord');
// split it in some int values
var values = coord.split(',');
var length = values.length;
// fill in your X and Y arrays
for (var i = 0; i < length; i++) {
// push in x and increase i by 1.
x.push(values[i++]);
// push in y
y.push(values[i]);
}
// get the min & max X values :
var minX = Math.min.apply(null, x),
maxX = Math.max.apply(null, x);
// get the min & max Y values :
var minY = Math.min.apply(null, y),
maxY = Math.max.apply(null, y);
// Here is your result :
var width = maxX - minX;
var height = maxY - minY;
Your devoted servant,
Apolo
NOTE : in my code I use the selector ".diff1", you have to do the same with ".diff2" to have values of your other polygon.
