Divi - 自定义地图模块

我试图编辑现有的地图模块的样式，以获得另一个地图主题，而不是默认的，但Divi似乎并没有提供该功能。所提到的风格Divi - 自定义地图模块

例子：

center: { 
     lat: 40.674, 
     lng: -73.945 
    }, 
    zoom: 12, 
    styles: [{ 
     "featureType": "all", 
     "elementType": "geometry", 
     "stylers": [{ 
      "color": "#8754c4" 
     }] 
    }, { 
     "featureType": "all", 
     "elementType": "labels.text.fill", 
     "stylers": [{ 
      "gamma": 0.01 
     }, { 
      "lightness": 20 
     }] 
    }, { 
     "featureType": "all", 
     "elementType": "labels.text.stroke", 
     "stylers": [{ 
      "saturation": -31 
     }, { 
      "lightness": -33 
     }, { 
      "weight": 2 
     }, { 
      "gamma": 0.8 
     }] 
    }, { 
     "featureType": "all", 
     "elementType": "labels.icon", 
     "stylers": [{ 
      "visibility": "off" 
     }] 
    }, { 
     "featureType": "administrative", 
     "elementType": "labels", 
     "stylers": [{ 
      "color": "#ffffff" 
     }] 
    }, { 
     "featureType": "administrative", 
     "elementType": "labels.text.stroke", 
     "stylers": [{ 
      "visibility": "off" 
     }] 
    }, { 
     "featureType": "landscape", 
     "elementType": "geometry", 
     "stylers": [{ 
      "lightness": 30 
     }, { 
      "saturation": 30 
     }] 
    }, { 
     "featureType": "landscape", 
     "elementType": "labels.text", 
     "stylers": [{ 
      "visibility": "off" 
     }] 
    }, { 
     "featureType": "landscape", 
     "elementType": "labels.text.stroke", 
     "stylers": [{ 
      "visibility": "off" 
     }] 
    }, { 
     "featureType": "poi", 
     "elementType": "all", 
     "stylers": [{ 
      "visibility": "on" 
     }] 
    }, { 
     "featureType": "poi", 
     "elementType": "geometry", 
     "stylers": [{ 
      "saturation": 20 
     }, { 
      "visibility": "on" 
     }] 
    }, { 
     "featureType": "poi", 
     "elementType": "geometry.fill", 
     "stylers": [{ 
      "color": "#8945c7" 
     }] 
    }, { 
     "featureType": "poi", 
     "elementType": "geometry.stroke", 
     "stylers": [{ 
      "visibility": "off" 
     }] 
    }, { 
     "featureType": "poi", 
     "elementType": "labels", 
     "stylers": [{ 
      "visibility": "off" 
     }] 
    }, { 
     "featureType": "poi.park", 
     "elementType": "geometry", 
     "stylers": [{ 
      "lightness": 20 
     }, { 
      "saturation": -20 
     }] 
    }, { 
     "featureType": "road", 
     "elementType": "geometry", 
     "stylers": [{ 
      "lightness": 10 
     }, { 
      "saturation": -30 
     }] 
    }, { 
     "featureType": "road", 
     "elementType": "geometry.stroke", 
     "stylers": [{ 
      "saturation": 25 
     }, { 
      "lightness": 25 
     }] 
    }, { 
     "featureType": "road", 
     "elementType": "labels", 
     "stylers": [{ 
      "color": "#ffffff" 
     }] 
    }, { 
     "featureType": "road", 
     "elementType": "labels.text", 
     "stylers": [{ 
      "color": "#ffffff" 
     }, { 
      "visibility": "on" 
     }] 
    }, { 
     "featureType": "road", 
     "elementType": "labels.text.fill", 
     "stylers": [{ 
      "color": "#ffffff" 
     }] 
    }, { 
     "featureType": "road", 
     "elementType": "labels.text.stroke", 
     "stylers": [{ 
      "visibility": "off" 
     }, { 
      "color": "#ff0000" 
     }] 
    }, { 
     "featureType": "transit", 
     "elementType": "labels", 
     "stylers": [{ 
      "visibility": "off" 
     }] 
    }, { 
     "featureType": "transit", 
     "elementType": "labels.text", 
     "stylers": [{ 
      "visibility": "off" 
     }] 
    }, { 
     "featureType": "transit", 
     "elementType": "labels.text.stroke", 
     "stylers": [{ 
      "visibility": "off" 
     }] 
    }, { 
     "featureType": "water", 
     "elementType": "all", 
     "stylers": [{ 
      "lightness": -20 
     }] 
    }, { 
     "featureType": "water", 
     "elementType": "geometry", 
     "stylers": [{ 
      "color": "#7950a9" 
     }] 
    }]

我怎么会去应用这些样式到现有的地图模块？有这个功能的外部插件吗？

https://elegantmarketplace.com/downloads/divi-map-extended-module/

该支付模块增加了这些功能，但我不知道是否有另一种方式去了解它。

来源

2017-03-10 user1938007

您可以将您的自定义样式在此文件：2405

/wp-content/themes/Divi/includes/builder/scripts/frontend-builder-scripts.js

线，替换此：

   $this_map_container.data('map', new google.maps.Map($this_map[0], { 
        zoom: parseInt($this_map.attr('data-zoom')), 
        center: new google.maps.LatLng(parseFloat($this_map.attr('data-center-lat')) , parseFloat($this_map.attr('data-center-lng'))), 
        mapTypeId: google.maps.MapTypeId.ROADMAP, 
        scrollwheel: $this_map.attr('data-mouse-wheel') == 'on' ? true : false, 
        draggable: is_draggable, 
        panControlOptions: { 
         position: $this_map_container.is('.et_beneath_transparent_nav') ? google.maps.ControlPosition.LEFT_BOTTOM : google.maps.ControlPosition.LEFT_TOP 
        }, 
        zoomControlOptions: { 
         position: $this_map_container.is('.et_beneath_transparent_nav') ? google.maps.ControlPosition.LEFT_BOTTOM : google.maps.ControlPosition.LEFT_TOP 
        }, 
        styles: [ { 
         stylers: [ 
          { saturation: parseInt(this_map_grayscale) } 
         ] 
        } ] 
       }));

与此：

$this_map_container.data('map', new google.maps.Map($this_map[0], { 
        zoom: parseInt($this_map.attr('data-zoom')), 
        center: new google.maps.LatLng(parseFloat($this_map.attr('data-center-lat')) , parseFloat($this_map.attr('data-center-lng'))), 
        mapTypeId: google.maps.MapTypeId.ROADMAP, 
        scrollwheel: $this_map.attr('data-mouse-wheel') == 'on' ? true : false, 
        draggable: is_draggable, 
        panControlOptions: { 
         position: $this_map_container.is('.et_beneath_transparent_nav') ? google.maps.ControlPosition.LEFT_BOTTOM : google.maps.ControlPosition.LEFT_TOP 
        }, 
        zoomControlOptions: { 
         position: $this_map_container.is('.et_beneath_transparent_nav') ? google.maps.ControlPosition.LEFT_BOTTOM : google.maps.ControlPosition.LEFT_TOP 
        }, 
        styles: [{ 
         "featureType": "all", 
         "elementType": "geometry", 
         "stylers": [{ 
          "color": "#8754c4" 
         }] 
        }, { 
         "featureType": "all", 
         "elementType": "labels.text.fill", 
         "stylers": [{ 
          "gamma": 0.01 
         }, { 
          "lightness": 20 
         }] 
        }, { 
         "featureType": "all", 
         "elementType": "labels.text.stroke", 
         "stylers": [{ 
          "saturation": -31 
         }, { 
          "lightness": -33 
         }, { 
          "weight": 2 
         }, { 
          "gamma": 0.8 
         }] 
        }, { 
         "featureType": "all", 
         "elementType": "labels.icon", 
         "stylers": [{ 
          "visibility": "off" 
         }] 
        }, { 
         "featureType": "administrative", 
         "elementType": "labels", 
         "stylers": [{ 
          "color": "#ffffff" 
         }] 
        }, { 
         "featureType": "administrative", 
         "elementType": "labels.text.stroke", 
         "stylers": [{ 
          "visibility": "off" 
         }] 
        }, { 
         "featureType": "landscape", 
         "elementType": "geometry", 
         "stylers": [{ 
          "lightness": 30 
         }, { 
          "saturation": 30 
         }] 
        }, { 
         "featureType": "landscape", 
         "elementType": "labels.text", 
         "stylers": [{ 
          "visibility": "off" 
         }] 
        }, { 
         "featureType": "landscape", 
         "elementType": "labels.text.stroke", 
         "stylers": [{ 
          "visibility": "off" 
         }] 
        }, { 
         "featureType": "poi", 
         "elementType": "all", 
         "stylers": [{ 
          "visibility": "on" 
         }] 
        }, { 
         "featureType": "poi", 
         "elementType": "geometry", 
         "stylers": [{ 
          "saturation": 20 
         }, { 
          "visibility": "on" 
         }] 
        }, { 
         "featureType": "poi", 
         "elementType": "geometry.fill", 
         "stylers": [{ 
          "color": "#8945c7" 
         }] 
        }, { 
         "featureType": "poi", 
         "elementType": "geometry.stroke", 
         "stylers": [{ 
          "visibility": "off" 
         }] 
        }, { 
         "featureType": "poi", 
         "elementType": "labels", 
         "stylers": [{ 
          "visibility": "off" 
         }] 
        }, { 
         "featureType": "poi.park", 
         "elementType": "geometry", 
         "stylers": [{ 
          "lightness": 20 
         }, { 
          "saturation": -20 
         }] 
        }, { 
         "featureType": "road", 
         "elementType": "geometry", 
         "stylers": [{ 
          "lightness": 10 
         }, { 
          "saturation": -30 
         }] 
        }, { 
         "featureType": "road", 
         "elementType": "geometry.stroke", 
         "stylers": [{ 
          "saturation": 25 
         }, { 
          "lightness": 25 
         }] 
        }, { 
         "featureType": "road", 
         "elementType": "labels", 
         "stylers": [{ 
          "color": "#ffffff" 
         }] 
        }, { 
         "featureType": "road", 
         "elementType": "labels.text", 
         "stylers": [{ 
          "color": "#ffffff" 
         }, { 
          "visibility": "on" 
         }] 
        }, { 
         "featureType": "road", 
         "elementType": "labels.text.fill", 
         "stylers": [{ 
          "color": "#ffffff" 
         }] 
        }, { 
         "featureType": "road", 
         "elementType": "labels.text.stroke", 
         "stylers": [{ 
          "visibility": "off" 
         }, { 
          "color": "#ff0000" 
         }] 
        }, { 
         "featureType": "transit", 
         "elementType": "labels", 
         "stylers": [{ 
          "visibility": "off" 
         }] 
        }, { 
         "featureType": "transit", 
         "elementType": "labels.text", 
         "stylers": [{ 
          "visibility": "off" 
         }] 
        }, { 
         "featureType": "transit", 
         "elementType": "labels.text.stroke", 
         "stylers": [{ 
          "visibility": "off" 
         }] 
        }, { 
         "featureType": "water", 
         "elementType": "all", 
         "stylers": [{ 
          "lightness": -20 
         }] 
        }, { 
         "featureType": "water", 
         "elementType": "geometry", 
         "stylers": [{ 
          "color": "#7950a9" 
         }] 
        }] 

       }));

来源

2017-05-06 13:09:10

当更新主题时，它可以被覆盖。 – Juan

你可以试试这个插件时髦的地图色差地图在divi，其易于处理插件LINK

您还可以访问的主要场所Snazzy map

如果你使用这个插件，那么它剂量不与主题更新覆盖。谢谢

来源

2017-07-29 10:53:12

Divi - 自定义地图模块

回答

相关问题