向jQuery商店定位器插件添加自定義地圖樣式

Question

我正在使用jQuery商店定位器插件（https://github.com/bjorn2404/jQuery-Store-Locator-Plugin）的客戶端網站的商店定位器。

我試圖將一些自定義的地圖樣式：

stylers: [ 
    { 'saturation': '-62' }, 
    { 'gamma': '0.5' } 
    ] 

我想我可以把它們放進mapSettings參數，但他們不被認可。我試過了我能想到的所有支架變化，但都無濟於事。

我現在在想，我需要進入jquery.storelocator.js，並將其添加到那裏，但我很難找到放置它的位置（如果這甚至是最佳解決方案）。

任何想法？

UPDATE 這裏是因爲我試圖實現它的代碼：

<script> 
$(function() { 
    $('#map-container').storeLocator({ 
     'dataType': 'json', 
     'dataLocation': '/data/locations.php', 
     'slideMap' : true, 
     'mapSettings' : { zoom : 12, mapTypeId: google.maps.MapTypeId.ROADMAP, stylers : [{'saturation' :'-62'}] } 
    }); 
}); 
</script> 

Answer 1

答案竟然是語法問題，畢竟。該mapSettings屬性被傳遞給在MapOptions類，並要求這兩個風格和造型器參數：

'mapSettings' : { zoom : 12, mapTypeId: google.maps.MapTypeId.ROADMAP, styles : [{stylers: [{'saturation' :'-62'}]}] } 

裏面的風格托架，您可以根據需要添加儘可能多的自定義設置，只要您使用stylers參數以及：

'mapSettings' : { zoom : 12, mapTypeId: google.maps.MapTypeId.ROADMAP, styles : [ 
      { 
       "featureType": "landscape", 
       "stylers": [ 
        { "saturation": -74 }, 
        { "lightness": 82 }, 
        { "gamma": 1.18 }, 
        { "color": "#eleff2" } 
       ] 
      },{ 
       "featureType": "water", 
       "stylers": [ 
        { "saturation": -49 }, 
        { "color": "#eleff2" }, 
        { "lightness": -1 }, 
        { "gamma": 1 } 
       ] 
      },{ 
       "featureType": "road", 
       "stylers": [ 
        { "hue": "#0099ff" }, 
        { "lightness": 4 }, 
        { "saturation": -78 } 
       ] 
      },{ 
       "featureType": "poi", 
       "stylers": [ 
        { "hue": "#0099ff" }, 
        { "saturation": -38 }, 
        { "lightness": 67 } 
       ] 
       } 
      ] } 

Answer 2

的MapOption用於設置地圖風格styles，不stylers。變化：

$(function() { 
    $('#map-container').storeLocator({ 
     'dataType': 'json', 
     'dataLocation': '/data/locations.php', 
     'slideMap' : true, 
     'mapSettings' : { zoom : 12, mapTypeId: google.maps.MapTypeId.ROADMAP, stylers : [{'saturation' :'-62'}] } 
    }); 
}); 

要：

$(function() { 
    $('#map-container').storeLocator({ 
     'dataType': 'json', 
     'dataLocation': '/data/locations.php', 
     'slideMap' : true, 
     'mapSettings' : { zoom : 12, mapTypeId: google.maps.MapTypeId.ROADMAP, styles : [{stylers : [{'saturation' :'-62'}]}] } 
    }); 
});