can't define style on google maps Polygon
<p>I'm trying to add some polygons on data layer. I have defined the colors that they should have. My problem is that I can't set a color for each but if I set the style it becomes like a global style.</p>

<p>My <a href="https://jsfiddle.net/dajtsd6e/1/#&amp;togetherjs=4rBeGoz08I" rel="nofollow">JS FIDDLE</a></p>

<p>I tried like , with an random color: </p>

<pre><code>function initMap() {
  var map = new google.maps.Map(document.getElementById('map'), {
    zoom: 6,
    center: {lat: -34.872, lng: 155.252},
  });

  var innerCoords1 = [
    {lat: -33.364, lng: 154.207},
    {lat: -34.364, lng: 154.207},
    {lat: -34.364, lng: 155.207},
    {lat: -33.364, lng: 155.207}
  ];

  var innerCoords2 = [
    {lat: -33.364, lng: 156.207},
    {lat: -34.364, lng: 156.207},
    {lat: -34.364, lng: 157.207},
    {lat: -33.364, lng: 157.207}
  ];
  var innerCoords3 = [
    {lat: -33.979, lng: 157.987},
    {lat: -34.979, lng: 157.987},
    {lat: -34.979, lng: 158.987},
    {lat: -33.979, lng: 158.987}
  ];

  map.data.add({geometry: new google.maps.Data.Polygon([innerCoords1,
                                                        innerCoords2,
                                                        innerCoords3])});
       map.data.setStyle(function(feature) {return {fillColor: getRandomColor(),strokeWeight: 5}})                                                                                              
}

function getRandomColor() {
    var letters = '0123456789ABCDEF';
    var color = '#';
    for (var i = 0; i &lt; 6; i++ ) {
        color += letters[Math.floor(Math.random() * 16)];
    }
    return color;
}
</code></pre>

<p>how can I define style(fill color) for each rectangle to be different and unique, can someone help me please?</p>