US map with hotspot for each state

I was working on a project last week and I needed a US map with hotspot for each state, when user clicks on a state in the map, the web displays information related to the selected state. I searched the Internet but could not find anything, so I decided to create my own US map with hotspot for each state.

Things needed:

  1. A US map picture with state names
  2. Macromedia Dreamweaver MX (I only have the old version, but it is enough)
  3. Patience, a lot.

Steps:

It is very easy, but very tedious to create hotspots on a map with Dreamweaver.

  1. Create a new HTML page
  2. Insert the US map picture
  3. In the <img> properties window, give a name for the Map field, say “usMap”
  4. Click “Polygon Hotspot Tool”, then mark spots through the border of a state until you come back to the first spot
  5. Dreamweaver will calculate the coordinates for each spot you marked.
  6. Repeat step 4 until you finished all the states of US.

To save your time and eyes, I am providing my work here free of charge. I have done two versions, one is for a 1000 X 618 US map, the other is 800X494, and it took me two full days to finish them. I hope it will help you.

Version 1

Map size: 1000 X 618

Here is the map picture (if you change the size, then you will have to recalculate the coordinates, so you should use the same picture):

us_map

Here is the HTML code for the map above:

<img src="images/us_map.png" width="1000" height="618" border="0" usemap="#usMap"> 

<map name="usMap">

  <area shape="poly" coords="61,29,59,39,61,55,63,62,58,75,70,84,71,94,81,99,89,99,99,102,111,104,127,104,161,110,175,46,93,25,94,38,94,48,88,43,82,41,74,38,61,29" href="#WA" alt="Washington">

  <area shape="poly" coords="66,82,57,81,42,121,29,146,24,164,92,188,140,196,153,152,148,147,160,132,166,120,162,110,141,106,131,105,112,105,90,100,75,98,66,83" href="#OR" alt="Oregon">

  <area shape="poly" coords="27,168,24,186,14,200,19,219,16,233,22,251,22,260,28,266,26,278,32,289,28,298,44,334,41,346,60,354,69,367,76,371,75,378,81,378,91,391,92,404,139,413,143,408,139,406,141,397,146,385,154,381,148,362,77,252,91,189,32,169" href="#CA" alt="California">

  <area shape="poly" coords="134,413,200,452,236,458,253,335,207,327,167,320,161,340,154,337,148,362,153,379,147,386,135,413,138" href="#AZ" alt="Arizona">

  <area shape="poly" coords="237,459,250,461,254,453,285,454,350,457,361,346,321,342,255,335,238,459" href="#NM" alt="New Mexico">

  <area shape="poly" coords="360,356,412,359,412,402,424,408,437,414,444,413,449,418,461,423,464,417,477,423,488,419,494,420,501,419,519,425,522,462,530,478,529,491,527,511,511,519,487,537,461,553,456,567,454,577,457,596,444,593,432,588,420,582,415,560,404,545,397,536,394,523,386,515,380,508,371,507,365,504,352,509,345,522,334,516,319,506,317,492,312,483,288,453,350,458,361,356" href="#TX" alt="Texas">

  <area shape="poly" coords="175,46,163,109,166,119,150,147,154,153,140,197,236,218,245,162,240,156,236,158,223,157,217,159,215,150,209,141,206,130,197,128,203,107,197,97,186,85,187,78,184,73,188,50,175,46" href="#ID" alt="Idaho">

  <area shape="poly" coords="189,51,278,66,365,78,357,164,248,151,245,161,240,156,228,157,219,157,212,142,209,130,198,128,203,108,188,87,189,77,185,74,190,51" href="#MT" alt="Montana">

  <area shape="poly" coords="248,152,233,237,350,253,356,165,247,152" href="#WY" alt="Wyoming">

  <area shape="poly" coords="91,188,77,253,148,360,155,339,161,341,188,209,91,189" href="#NV" alt="Nevada">

  <area shape="poly" coords="189,210,167,321,253,336,268,243,234,239,236,218,190,210" href="#UT" alt="Utah">

  <area shape="poly" coords="268,244,255,334,328,342,377,344,382,257,315,251,269,244" href="#CO" alt="Colorado">

  <area shape="poly" coords="366,78,360,143,475,148,474,139,472,136,471,113,467,104,467,82,367,77" href="#ND" alt="North Dakota">

  <area shape="poly" coords="360,144,356,164,354,209,439,213,450,218,459,217,476,224,477,214,475,205,477,163,471,157,473,149,360,144" href="#SD" alt="South Dakota">

  <area shape="poly" coords="354,210,350,254,382,258,382,280,495,282,489,270,478,225,460,219,449,219,440,215,417,214,354,210" href="#NE" alt="Nebraska">

  <area shape="poly" coords="381,280,378,345,444,350,507,349,509,306,502,293,502,286,496,283,382,280" href="#KS" alt="Kansas">

  <area shape="poly" coords="363,345,361,357,413,360,412,402,437,414,445,414,460,420,465,419,476,422,493,420,497,418,512,422,510,365,508,350,432,351,364,345" href="#OK" alt="Oklahoma">

  <area shape="poly" coords="468,81,468,106,471,113,472,124,473,137,476,146,473,155,477,164,476,203,561,201,560,193,552,183,545,177,538,173,535,166,537,159,534,153,542,145,542,131,554,120,560,111,578,100,574,98,562,96,554,99,544,95,528,89,522,91,505,86,500,73,497,80,469,80" href="#MN" alt="Minnesota">

  <area shape="poly" coords="477,204,478,222,490,268,556,266,561,270,568,257,566,249,577,244,579,233,571,221,564,217,561,201,561,203,477,203" href="#IA" alt="Iowa">

  <area shape="poly" coords="489,268,495,282,503,287,503,294,510,307,508,350,510,360,588,358,589,363,587,368,595,367,599,358,604,353,605,345,600,342,601,333,583,320,586,306,575,304,575,300,563,284,562,271,558,267,489,268" href="#MO" alt="Missouri">

  <area shape="poly" coords="511,360,514,423,520,428,522,440,574,436,575,419,591,390,590,383,596,367,588,367,587,360,513,360" href="#AR" alt="Arkansas">

  <area shape="poly" coords="522,440,522,461,532,481,527,510,537,511,557,515,562,510,569,514,579,517,578,522,588,525,596,519,604,518,617,524,618,518,608,514,612,508,610,504,604,504,608,498,601,490,602,482,569,483,567,474,577,453,573,437,522,440" href="#LA" alt="Louisiana">

  <area shape="poly" coords="543,132,541,146,535,152,538,161,536,168,551,182,560,194,565,218,571,222,618,218,617,211,614,206,617,196,616,185,619,175,626,159,614,173,613,161,612,149,608,144,576,136,569,131,562,132,562,124,543,131" href="#WI" alt="Wisconsin">

  <area shape="poly" coords="574,223,578,234,577,245,568,250,569,257,563,269,563,283,576,301,586,307,584,320,602,334,603,343,608,341,618,343,617,334,621,331,623,322,629,304,628,294,625,240,617,220,573,223" href="#IL" alt="Illinois">

  <area shape="poly" coords="73,471,82,498,73,499,73,491,60,494,60,503,64,510,74,514,81,514,77,523,69,526,60,523,51,533,51,543,54,554,61,552,59,564,81,570,75,582,59,590,36,595,49,596,66,592,86,584,100,574,97,572,105,564,113,556,107,566,119,567,127,566,125,560,132,559,144,567,160,572,179,584,190,600,199,612,205,612,206,606,212,611,214,604,204,599,190,580,185,574,176,577,166,570,157,563,156,480,152,477,143,476,134,472,127,470,122,466,116,462,110,459,99,462,90,464,74,471" href="#AK" alt="Alaska">

  <area shape="poly" coords="623,238,629,287,628,299,628,306,623,324,635,322,644,319,648,322,652,318,657,317,667,305,665,300,675,297,674,292,669,231,638,234" href="#IN" alt="Indiana">

  <area shape="poly" coords="624,324,621,332,616,337,616,343,610,342,605,344,602,356,624,356,626,353,697,345,704,341,728,321,719,311,717,303,712,301,710,297,703,298,693,298,687,295,680,291,676,294,668,300,659,316,649,320,625,324" href="#KY" alt="Kentucky">

  <area shape="poly" coords="645,211,637,194,640,163,649,163,652,153,657,150,654,148,660,143,678,148,685,161,685,169,679,183,682,188,695,175,703,198,700,209,695,214,695,222,691,229,670,231,635,236,642,225" href="#MI" alt="Michigan">

  <area shape="poly" coords="600,356,622,357,628,353,693,346,736,341,731,351,722,354,718,360,704,369,696,375,696,381,651,386,592,389,591,384,600,357" href="#TN" alt="Tennessee">

  <area shape="poly" coords="592,390,575,420,575,432,574,440,577,452,568,476,571,484,602,483,601,490,607,496,620,491,631,490,626,443,626,388,592,391" href="#MS" alt="Mississippi">

  <area shape="poly" coords="626,389,674,385,690,441,691,449,693,463,694,473,646,478,649,485,650,491,644,494,638,486,634,493,632,491,626,440" href="#AL" alt="Alabama">

  <area shape="poly" coords="671,232,675,295,680,291,695,297,709,297,717,302,723,289,728,288,729,278,741,272,744,245,738,217,719,231,705,233,693,230,671,233" href="#OH" alt="Ohio">

  <area shape="poly" coords="738,218,748,265,824,252,826,249,831,249,842,237,832,229,831,220,835,211,824,200,738,218" href="#PA" alt="Pennsylvania">

  <area shape="poly" coords="758,184,761,192,749,209,750,215,823,200,835,212,850,217,851,224,867,220,879,209,867,213,856,214,853,197,852,172,851,161,846,158,845,146,838,127,814,133,799,154,800,164,797,171,789,178,773,178,759,183" href="#NY" alt="New York">

  <area shape="poly" coords="329,610,327,599,322,594,325,586,307,572,278,560,255,550,241,543,248,539,254,538,279,549,300,561,315,565,322,571,326,582,336,587,345,597" href="#HI" alt="Hawaii">

  <area shape="poly" coords="674,385,691,442,696,476,746,474,750,477,751,470,761,469,763,457,763,450,766,439,757,430,755,425,750,418,743,410,734,402,727,394,714,387,719,380,697,381,675,385" href="#GA" alt="Georgia">

  <area shape="poly" coords="647,478,650,490,668,488,680,492,691,499,700,498,710,490,721,495,734,505,744,513,747,532,756,536,752,545,764,564,775,576,783,579,790,590,801,586,800,579,804,571,801,550,786,523,788,516,780,508,770,493,762,470,754,470,752,478,746,475,697,477,696,473,647,478" href="#FL" alt="Florida">

  <area shape="poly" coords="719,379,737,371,754,369,760,376,778,373,803,390,797,396,795,406,766,439,754,423,745,412,734,403,729,395,714,389,719,380" href="#SC" alt="South Carolina">

  <area shape="poly" coords="696,382,696,375,717,362,722,355,730,352,736,342,779,334,837,321,847,335,839,348,832,349,836,355,833,360,840,362,829,368,820,373,814,385,803,391,776,374,761,378,754,370,738,373,722,377,713,380,696,382" href="#NC" alt="North Carolina">

  <area shape="poly" coords="703,345,740,341,838,324,837,315,829,316,828,310,827,293,815,290,809,288,811,278,796,268,795,274,787,268,775,281,774,291,767,289,761,307,759,314,745,324,736,326,731,324,727,322,702,345" href="#VA" alt="Virginia">

  <area shape="poly" coords="744,254,742,272,731,279,729,290,722,292,719,304,721,315,727,320,733,325,738,326,745,324,750,322,756,319,759,315,761,307,763,298,766,295,767,291,773,292,773,285,778,278,781,274,782,270,785,269,792,274,796,271,794,267,789,265,785,265,778,264,774,270,768,273,766,264,749,266,744,256" href="#WV" alt="West Virginia">

  <area shape="poly" coords="839,128,864,120,869,130,864,136,862,150,863,172,853,174,852,163,847,159,845,144,839,128" href="#VT" alt="Vermont">

  <area shape="poly" coords="863,172,884,169,889,161,884,154,871,112,867,118,868,132,863,140,863,172" href="#NH" alt="New Hampshire">

  <area shape="poly" coords="871,113,880,136,890,159,882,152,894,144,898,137,907,131,908,121,914,122,920,116,922,119,935,104,932,99,927,99,926,91,920,91,910,60,902,54,895,62,886,58,880,78,879,89,881,96,871,113" href="#ME" alt="Maine">

  <area shape="poly" coords="853,192,878,187,881,200,865,205,857,214,854,193" href="#CT" alt="Connecticut">

  <area shape="poly" coords="853,176,853,193,877,187,883,183,892,192,900,187,909,186,909,181,903,183,898,181,896,178,889,176,891,167,888,165,880,172,854,175" href="#MA" alt="Massachusetts">

  <area shape="poly" coords="879,189,883,185,893,194,883,198,879,189" href="#RI" alt="Rhode Island">

  <area shape="poly" coords="835,213,832,227,842,238,833,248,837,260,845,260,854,247,852,232,847,230,851,223,849,217,837,212" href="#NJ" alt="New Jersey">

  <area shape="poly" coords="827,251,833,278,843,278,842,273,838,269,829,251" href="#DE" alt="Delaware">

  <area shape="poly" coords="765,264,827,251,833,278,844,279,838,306,835,304,838,288,825,284,823,277,825,272,824,264,820,263,817,267,819,277,820,286,814,286,811,281,804,274,798,269,792,262,783,264,772,273,765,264" href="#MD" alt="Maryland">

  <area shape="rect" coords="884,334,995,350" href="#DC" alt="Washington, D.C.">

</map>

 

 

I made each hotspot link to an anchor on the same page, if you need to link to a different page, just change the “href” part.

Also, make sure the image source points to the correct path in your file structure.

 

Version 2

Map size: 800 X 494

Here is the map picture:

us_map800

Here is the HTML code for the map above:

<img src="images/us_map800.png" width="800" height="494" border="0" usemap="#usMap"> 

<map name="usMap">

  <area shape="poly" coords="48,23,47,31,48,44,50,49,46,60,56,67,56,75,64,79,71,79,79,81,88,83,101,83,128,88,140,36,74,20,75,30,75,38,70,34,65,32,59,30,48,23" href="#WA" alt="Washington">

  <area shape="poly" coords="52,65,45,64,33,96,23,116,19,131,73,150,112,156,122,121,118,117,128,105,132,96,129,88,112,84,104,84,89,84,72,80,60,78,52,66" href="#OR" alt="Oregon">

  <area shape="poly" coords="21,134,19,148,11,160,15,175,12,186,17,200,17,208,22,212,20,222,25,231,22,238,35,267,32,276,48,283,55,293,60,296,60,302,64,302,72,312,73,323,111,330,114,326,111,324,112,317,116,308,123,304,118,289,61,201,72,151,25,135" href="#CA" alt="California">

  <area shape="poly" coords="107,330,160,361,188,366,202,268,165,261,133,256,128,272,123,269,118,289,122,303,117,308,108,330,110" href="#AZ" alt="Arizona">

  <area shape="poly" coords="189,367,200,368,203,362,228,363,280,365,288,276,256,273,204,268,190,367" href="#NM" alt="New Mexico">

  <area shape="poly" coords="288,284,329,287,329,321,339,326,349,331,355,330,359,334,368,338,371,333,381,338,390,335,395,336,400,335,415,340,417,369,424,382,423,392,421,408,408,415,389,429,368,442,364,453,363,461,365,476,355,474,345,470,336,465,332,448,323,436,317,428,315,418,308,412,304,406,296,405,292,403,281,407,276,417,267,412,255,404,253,393,249,386,230,362,280,366,288,284" href="#TX" alt="Texas">

  <area shape="poly" coords="140,36,130,87,132,95,120,117,123,122,112,157,188,174,196,129,192,124,188,126,178,125,173,127,172,120,167,112,164,104,157,102,162,85,157,77,148,68,149,62,147,58,150,40,140,36" href="#ID" alt="Idaho">

  <area shape="poly" coords="151,40,222,52,292,62,285,131,198,120,196,128,192,124,182,125,175,125,169,113,167,104,158,102,162,86,150,69,151,61,148,59,152,40" href="#MT" alt="Montana">

  <area shape="poly" coords="198,121,186,189,280,202,284,132,197,121" href="#WY" alt="Wyoming">

  <area shape="poly" coords="72,150,61,202,118,288,124,271,128,272,150,167,72,151" href="#NV" alt="Nevada">

  <area shape="poly" coords="151,168,133,256,202,268,214,194,187,191,188,174,152,168" href="#UT" alt="Utah">

  <area shape="poly" coords="214,195,204,267,262,273,301,275,305,205,252,200,215,195" href="#CO" alt="Colorado">

  <area shape="poly" coords="292,62,288,114,380,118,379,111,377,108,376,90,373,83,373,65,293,61" href="#ND" alt="North Dakota">

  <area shape="poly" coords="288,115,284,131,283,167,351,170,360,174,367,173,380,179,381,171,380,164,381,130,376,125,378,119,288,115" href="#SD" alt="South Dakota">

  <area shape="poly" coords="283,168,280,203,305,206,305,224,396,225,391,216,382,180,368,175,359,175,352,172,333,171,283,168" href="#NE" alt="Nebraska">

  <area shape="poly" coords="304,224,302,276,355,280,405,279,407,244,401,234,401,228,396,226,305,224" href="#KS" alt="Kansas">

  <area shape="poly" coords="290,276,288,285,330,288,329,321,349,331,356,331,368,336,372,335,380,337,394,336,397,334,409,337,408,292,406,280,345,280,291,276" href="#OK" alt="Oklahoma">

  <area shape="poly" coords="374,64,374,84,376,90,377,99,378,109,380,116,378,124,381,131,380,162,448,160,448,154,441,146,436,141,430,138,428,132,429,127,427,122,433,116,433,104,443,96,448,88,462,80,459,78,449,76,443,79,435,76,422,71,417,72,404,68,400,58,397,64,375,64" href="#MN" alt="Minnesota">

  <area shape="poly" coords="381,163,382,177,392,214,444,212,448,216,454,205,452,199,461,195,463,186,456,176,451,173,448,160,448,162,381,162" href="#IA" alt="Iowa">

  <area shape="poly" coords="391,214,396,225,402,229,402,235,408,245,406,280,408,288,470,286,471,290,469,294,476,293,479,286,483,282,484,276,480,273,480,266,466,256,468,244,460,243,460,240,450,227,449,216,446,213,391,214" href="#MO" alt="Missouri">

  <area shape="poly" coords="408,288,411,338,416,342,417,352,459,348,460,335,472,312,472,306,476,293,470,293,469,288,410,288" href="#AR" alt="Arkansas">

  <area shape="poly" coords="417,352,417,368,425,384,421,408,429,408,445,412,449,408,455,411,463,413,462,417,470,420,476,415,483,414,493,419,494,414,486,411,489,406,488,403,483,403,486,398,480,392,481,385,455,386,453,379,461,362,458,349,417,352" href="#LA" alt="Louisiana">

  <area shape="poly" coords="434,105,432,116,428,121,430,128,428,134,440,145,448,155,452,174,456,177,494,174,493,168,491,164,493,156,492,148,495,140,500,127,491,138,490,128,489,119,486,115,460,108,455,104,449,105,449,99,434,104" href="#WI" alt="Wisconsin">

  <area shape="poly" coords="459,178,462,187,461,196,454,200,455,205,450,215,450,226,460,240,468,245,467,256,481,267,482,274,486,272,494,274,493,267,496,264,498,257,503,243,502,235,500,192,493,176,458,178" href="#IL" alt="Illinois">

  <area shape="poly" coords="58,376,65,398,58,399,58,392,48,395,48,402,51,408,59,411,64,411,61,418,55,420,48,418,40,426,40,434,43,443,48,441,47,451,64,456,60,465,47,472,28,476,39,476,52,473,68,467,80,459,77,457,84,451,90,444,85,452,95,453,101,452,100,448,105,447,115,453,128,457,143,467,152,480,159,489,164,489,164,484,169,488,171,483,163,479,152,464,148,459,140,461,132,456,125,450,124,384,121,381,114,380,107,377,101,376,97,372,92,369,88,367,79,369,72,371,59,376" href="#AK" alt="Alaska">

  <area shape="poly" coords="498,190,503,229,502,239,502,244,498,259,508,257,515,255,518,257,521,254,525,253,533,244,532,240,540,237,539,233,535,184,510,187" href="#IN" alt="Indiana">

  <area shape="poly" coords="499,259,496,265,492,269,492,274,488,273,484,275,481,284,499,284,500,282,557,276,563,272,582,256,575,248,573,242,569,240,568,237,562,238,554,238,549,236,544,232,540,235,534,240,527,252,519,256,500,259" href="#KY" alt="Kentucky">

  <area shape="poly" coords="516,168,509,155,512,130,519,130,521,122,525,120,523,118,528,114,542,118,548,128,548,135,543,146,545,150,556,140,562,158,560,167,556,171,556,177,552,183,536,184,508,188,513,180" href="#MI" alt="Michigan">

  <area shape="poly" coords="480,284,497,285,502,282,554,276,588,272,584,280,577,283,574,288,563,295,556,300,556,304,520,308,473,311,472,307,480,285" href="#TN" alt="Tennessee">

  <area shape="poly" coords="473,312,460,336,460,345,459,352,461,361,454,380,456,387,481,386,480,392,485,396,496,392,504,392,500,354,500,310,473,312" href="#MS" alt="Mississippi">

  <area shape="poly" coords="500,311,539,308,552,352,552,359,554,370,555,378,516,382,519,388,520,392,515,395,510,388,507,394,505,392,500,352" href="#AL" alt="Alabama">

  <area shape="poly" coords="536,185,540,236,544,232,556,237,567,237,573,241,578,231,582,230,583,222,592,217,595,196,590,173,575,184,564,186,554,184,536,186" href="#OH" alt="Ohio">

  <area shape="poly" coords="590,174,598,212,659,201,660,199,664,199,673,189,665,183,664,176,668,168,659,160,590,174" href="#PA" alt="Pennsylvania">

  <area shape="poly" coords="606,147,608,153,599,167,600,172,658,160,668,169,680,173,680,179,693,176,703,167,693,170,684,171,682,157,681,137,680,128,676,126,676,116,670,101,651,106,639,123,640,131,637,136,631,142,618,142,607,146" href="#NY" alt="New York">

  <area shape="poly" coords="263,488,261,479,257,475,260,468,245,457,222,448,204,440,192,434,198,431,203,430,223,439,240,448,252,452,257,456,260,465,268,469,276,477" href="#HI" alt="Hawaii">

  <area shape="poly" coords="539,308,552,353,556,380,596,379,600,381,600,376,608,375,610,365,610,360,612,351,605,344,604,340,600,334,594,328,587,321,581,315,571,309,575,304,557,304,540,308" href="#GA" alt="Georgia">

  <area shape="poly" coords="517,382,520,392,534,390,544,393,552,399,560,398,568,392,576,396,587,404,595,410,597,425,604,428,601,436,611,451,620,460,626,463,632,472,640,468,640,463,643,456,640,440,628,418,630,412,624,406,616,394,609,376,603,376,601,382,596,380,557,381,556,378,517,382" href="#FL" alt="Florida">

  <area shape="poly" coords="575,303,589,296,603,295,608,300,622,298,642,312,637,316,636,324,612,351,603,338,596,329,587,322,583,316,571,311,575,304" href="#SC" alt="South Carolina">

  <area shape="poly" coords="556,305,556,300,573,289,577,284,584,281,588,273,623,267,669,256,677,268,671,278,665,279,668,284,666,288,672,289,663,294,656,298,651,308,642,312,620,299,608,302,603,296,590,298,577,301,570,304,556,305" href="#NC" alt="North Carolina">

  <area shape="poly" coords="562,276,592,272,670,259,669,252,663,252,662,248,661,234,652,232,647,230,648,222,636,214,636,219,629,214,620,224,619,232,613,231,608,245,607,251,596,259,588,260,584,259,581,257,561,276" href="#VA" alt="Virginia">

  <area shape="poly" coords="595,203,593,217,584,223,583,232,577,233,575,243,576,252,581,256,586,260,590,260,596,259,600,257,604,255,607,252,608,245,610,238,612,236,613,232,618,233,618,228,622,222,624,219,625,216,628,215,633,219,636,216,635,213,631,212,628,212,622,211,619,216,614,218,612,211,599,212,595,204" href="#WV" alt="West Virginia">

  <area shape="poly" coords="671,102,691,96,695,104,691,108,689,120,690,137,682,139,681,130,677,127,676,115,671,102" href="#VT" alt="Vermont">

  <area shape="poly" coords="690,137,707,135,711,128,707,123,696,89,693,94,694,105,690,112,690,137" href="#NH" alt="New Hampshire">

  <area shape="poly" coords="696,90,704,108,712,127,705,121,715,115,718,109,725,104,726,96,731,97,736,92,737,95,748,83,745,79,741,79,740,72,736,72,728,48,721,43,716,49,708,46,704,62,703,71,704,76,696,90" href="#ME" alt="Maine">

  <area shape="poly" coords="682,153,702,149,704,160,692,164,685,171,683,154" href="#CT" alt="Connecticut">

  <area shape="poly" coords="682,140,682,154,701,149,706,146,713,153,720,149,727,148,727,144,722,146,718,144,716,142,711,140,712,133,710,132,704,137,683,140" href="#MA" alt="Massachusetts">

  <area shape="poly" coords="703,151,706,148,714,155,706,158,703,151" href="#RI" alt="Rhode Island">

  <area shape="poly" coords="668,170,665,181,673,190,666,198,669,208,676,208,683,197,681,185,677,184,680,178,679,173,669,169" href="#NJ" alt="New Jersey">

  <area shape="poly" coords="661,200,666,222,674,222,673,218,670,215,663,200" href="#DE" alt="Delaware">

  <area shape="poly" coords="612,211,661,200,666,222,675,223,670,244,668,243,670,230,660,227,658,221,660,217,659,211,656,210,653,213,655,221,656,228,651,228,648,224,643,219,638,215,633,209,626,211,617,218,612,211" href="#MD" alt="Maryland">

  <area shape="rect" coords="707,267,796,280" href="#DC" alt="Washington, D.C.">

</map>

 

To see a live demo implemented in WordPress, click here.

If you use any of my work and find it helpful, I hope you can buy me a cup of coffee by making a small donation.

donate

5
Leave a Reply

avatar
5 Comment threads
0 Thread replies
0 Followers
 
Most reacted comment
Hottest comment thread
4 Comment authors
Michael RockBeau GriffisCodingBeaverKay Recent comment authors
  Subscribe  
newest oldest most voted
Notify of
Kay
Guest

You are a rock star! Thank you so much for posting the map and code – you saved me many hours of trying to figure this out and then coding the whole thing. I gladly made a donation 🙂

Beau Griffis
Guest

I am trying to implemnet this into http://rehabfinder.info/?page_id=42, and then have different pages that list different rehabilitation centers, but I can't seem to get it to work with word press for some reason. I have the right image and the right html code, but for some reason it's not working. Is there anyway someone could help me fix this problem, if I'm able to use it, I'll be glad to donate, since this would be real useful to me.

Michael Rock
Guest

Great work! Except you forgot to include the upper peninsula of Michigan.