-1

I have got a drop down of State and cities . Upon selection of a State , corresponding cities will be displayed and once clicked on Go button , i am showning that particular city uisng Google Map.

Could you please let me know if how is it posible to show that city in a different color ?

I was trying to follow this website , in which the author shows the city in red color .

http://www.encodedna.com/2014/05/drawing-circles-with-google-maps-javascript-api.htm

But when i tried to represent the same its not working in fiddle

http://jsfiddle.net/4dSd7/25/

The second option i see that , i need to use Polygon to do so , but to so how can i get the area , because every example i see the area coordinates are hardcoded as shown here

var triangleCoords = [
    new google.maps.LatLng(25.774252, -80.190262),
    new google.maps.LatLng(18.466465, -66.118292),
    new google.maps.LatLng(32.321384, -64.75737),
    new google.maps.LatLng(25.774252, -80.190262)
  ];

https://developers.google.com/maps/documentation/javascript/examples/polygon-simple

Could you please let em know how to approach this requirement .

duncan
  • 31,401
  • 13
  • 78
  • 99
Pawan
  • 31,545
  • 102
  • 256
  • 434

1 Answers1

1

You never gave your div height and width properties so the div doesnt have dimensions, therefore the map never shows. For the map to show you need to set some dimensions on your map div

#map {
    height: 600px;
    width: 600px;
}

Here is your fiddle with css height and width attrs. Updated fiddle to include googlemaps in the external resource sidebar and to link to https so there is no conflict in fiddle.

https://jsfiddle.net/4dSd7/33/

Craicerjack
  • 6,203
  • 2
  • 31
  • 39
  • updated - include libraries, like googlemaps, in jsfiddle using the external resources option on the leftsidebar. Also fiddle is https so needed googlemaps link to be https: – Craicerjack May 14 '15 at 10:27