具有自定义样式字段的ACF地图

我有一个可以创建地图的选项页面，我创建了一个自定义字段来粘贴我自己的样式。我需要做的是在我的地图中传递这些信息。js。我所做的是创建一个这样的隐藏div（我使用的是木材）：

<div class="hidden" id="map-styles">{{ options.map_styles }}</div>

然后在地图中。js我得到如下信息：

function initMap($el) {

// Find marker elements within map.
var $markers = $el.find(".marker");
var styles = document.getElementById("map-styles").textContent;

// Create generic map.
var mapArgs = {
zoom: $el.data("zoom") || 16,
mapTypeId: google.maps.MapTypeId.ROADMAP,
styles: styles,
};

但是如果我在做控制台，它就不起作用了。日志（\'styles\'），我看到了我的代码，如果我直接将代码粘贴到js文件中，它就会正常工作。你们知道怎么解决这个问题吗？如果你能让我走上正轨，我会非常感激。

您可以在此处看到地图：http://thefabulous.odns.fr/

谢谢

// map args var mapArgs = { zoom: $el.data("zoom") || 16, mapTypeControlOptions: { mapTypeIds: [ \'custom_map_style\', google.maps.MapTypeId.ROADMAP, google.maps.MapTypeId.SATELLITE ], style: google.maps.MapTypeControlStyle.HORIZONTAL } }; // set our map var map = new google.maps.Map($el[0], mapArgs); // get our json from #map-sytles div var customStyle = JSON.parse($(\'#map-styles\').text()); // create the custom styled map type object var customStyleMap = new google.maps.StyledMapType(customStyle, { name: \'Custom Style\' }); // set the custom styled map type against the map map.mapTypes.set(\'custom_map_style\', customStyleMap); map.setMapTypeId(\'custom_map_style\');

相关推荐