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 - 自定義地圖模塊

回答

相關問題