देवी - कस्टम मानचित्र मॉड्यूल

Question

मैंने डिफ़ॉल्ट मानचित्र के बजाय एक और मानचित्र विषय प्राप्त करने के लिए मौजूदा मानचित्र मॉड्यूल की शैलियों को संपादित करने का प्रयास किया है, लेकिन देवी उस सुविधा की पेशकश नहीं कर रहा है।

उल्लेख शैलियों का उदाहरण:

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/

यह भुगतान किया मॉड्यूल इन सुविधाओं को जोड़ता है, लेकिन इसके बारे में जाने के लिए एक और तरीका है मैं सोच रहा हूँ।

Answer 1

आप इस फ़ाइल में अपने कस्टम शैली जोड़ सकते हैं:

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

लाइन 2405, इस की जगह:

   $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" 
         }] 
        }] 

       })); 

Answer 2

आप प्लगइन कोशिश कर सकते हैं Snizy नक्शा divi में colormap के लिए,को संभालने में आसान हैप्लगइन LINK

तुम भी मुख्य साइट पर जा सकते Snazzy map

आप इस प्लगइन का उपयोग करते हैं, तो यह विषय अद्यतन के साथ अधिलेखित नहीं खुराक। धन्यवाद