Alan Udup
Alan Udup

Reputation: 21

how to fill polygons with gradient color in google maps javascript api v3

i have drawn a polygon using the code below

    var triangleCoords = [
        new google.maps.LatLng(37.80071485890158, -122.45498657226562),
        new google.maps.LatLng(37.75621226898872, -122.45292663574219),
        new google.maps.LatLng(37.73177873209313, -122.42889404296875),
        new google.maps.LatLng(37.73992414059749, -122.37808227539062),
        new google.maps.LatLng(37.80993765238262, -122.40348815917969)
    ];

    bermudaTriangle = new google.maps.Polygon({
            paths: triangleCoords,
            strokeColor: '#FF0000',
            strokeOpacity: 0.8,
            strokeWeight: 2,
            fillColor: '#334433',
            fillOpacity: 0.35
        });
    bermudaTriangle.setMap(map);

but i want to fill polygon with gradient rather than a single color.how can i do it?

Upvotes: 2

Views: 2902

Answers (1)

Jack B Nimble
Jack B Nimble

Reputation: 5087

That is not currently supported by the API. The listed properties for styling the Polygon object are:

  • fillColor
  • fillOpacity
  • strokeColor
  • strokeOpacity
  • strokePosition
  • strokeWeight

Since there is only a single fillColor, the inner color is solid (ie, none patterned or gradient).

Upvotes: 1

Related Questions