解析圖像座標上的座標

Question

我有一個可點擊的美國html圖像地圖，但我想調整它的一半大小。這意味着我也需要將所有的座標值分成兩半，以確保點擊區域的準確性。而不是手動執行此操作，有沒有簡單的方法來遍歷DOM並自動將所有座標除以2？這裏的HTML：

<div id="map"> 
    <img class="map" src="images/us_map.jpg" width="960" height="593" usemap="#usa"> 
    <map name="usa"> 
    <area href="#" title="SC" shape="poly" coords="735,418, 734,419, 731,418, 731,416, 729,413, 727,411, 725,410, 723,405, 720,399, 716,398, 714,396, 713,393, 711,391, 709,390, 707,387, 704,385, 699,383, 699,382, 697,379, 696,378, 693,373, 690,373, 686,371, 684,369, 684,368, 685,366, 687,365, 687,363, 693,360, 701,356, 708,355, 724,355, 727,356, 728,360, 732,359, 745,358, 747,358, 760,366, 769,374, 764,379, 762,385, 761,391, 759,392, 758,394, 756,395, 754,398, 751,401, 749,404, 748,405, 744,408, 741,409, 742,412, 737,417, 735,418"></area> 
    <area href="#" title="HI" shape="poly" coords="225,521, 227,518, 229,517, 229,518, 227,521, 225,521"></area> 
    <area href="#" title="HI" shape="poly" coords="235,518, 241,520, 243,520, 244,516, 244,513, 240,512, 236,514, 235,518"></area> 

'

Answer 1

我有類似：

var rects = document.getElementsByTagName('area'); 
var ratio = 1/2; 

for (i = 0; i < rects.length; i++) { 
    coords = rects[i].coords.split(","); 
    coord = ''; 
    for (j = 0; j < coords.length; j++) { 
     newCoord = coords[j].trim() * ratio; 
     coord += newCoord; 
     if (j + 1 < coords.length) { 
      coord +=', '; 
     } 
    }  
    rects[i].coords = coord; 
}