क्या इन्फोविंडो को वहीं खोलना संभव है जहां उपयोगकर्ता मानचित्र पर क्लिक करता है?

यहाँ मेरे पास अभी क्या है:

  OnClickMap(event) {
    const map = this.state.map;
    const title = this.props.createNewMarkerTitle;
    const marker = {
      latLng: {
        lat: event.latLng.lat(),
        lng: event.latLng.lng()
      }
    };

    const markerOnMap = new google.maps.Marker({
      position: marker.latLng,
      map: map,
      title: title
    });

    const infowindow = new google.maps.InfoWindow();
    const content = document.createElement('div');
    ReactDOM.render(this.renderCreateNewMarkerInfoWindow(), content);
    infowindow.setContent(content);

    markerOnMap.addListener('click', function() {
      infowindow.open(map, markerOnMap);
    });
  }

मुझे यकीन नहीं है कि मैं सिर्फ नक्शे पर कैसे क्लिक कर सकता हूं, और जहां मैंने क्लिक किया है, उस पर इन्फोविंडो खुला है। मैंने मार्कर को हटाकर और केवल इन्फोविंडो खोलकर गड़बड़ करने की कोशिश की, लेकिन इससे ऊपर बाईं ओर खिड़की खुलती है क्योंकि मुझे यकीन नहीं है कि इसे लैटलिंग कैसे पास किया जाए।

क्या यह संभव है? अन्यथा, मैं कुछ कैसे स्थापित कर सकता हूं जहां:

click the map -> 
creates a marker -> 
immediately opens infowindow (instead of having to click the marker to open it)
-1
user1354934 11 फरवरी 2017, 13:31

1 उत्तर

सबसे बढ़िया उत्तर

मानचित्र पर क्लिक किए गए स्थान पर InfoWindow खोलने के लिए (बिना किसी मार्कर), आपको InfoWindow की .position प्रॉपर्टी सेट करनी होगी (और .open कॉल में वैकल्पिक anchor शामिल न करें)।

map.addListener('click', function(evt) {
  var infowindow = new google.maps.InfoWindow();
  infowindow.setPosition(evt.latLng);
  var content = evt.latLng.toUrlValue(6);
  infowindow.setContent(content);
  infowindow.open(map);
});

अवधारणा पहेली का सबूत

कोड स्निपेट:

function initialize() {
  var map = new google.maps.Map(
    document.getElementById("map_canvas"), {
      center: new google.maps.LatLng(37.4419, -122.1419),
      zoom: 13,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });
  map.addListener('click', function(evt) {
    var infowindow = new google.maps.InfoWindow();
    infowindow.setPosition(evt.latLng);
    var content = evt.latLng.toUrlValue(6);
    infowindow.setContent(content);
    infowindow.open(map);
  });
}
google.maps.event.addDomListener(window, "load", initialize);
html,
body,
#map_canvas {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}
<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="map_canvas"></div>
1
geocodezip 11 फरवरी 2017, 16:04
बहुत बहुत धन्यवाद! प्रतिक्रिया का उपयोग करके यह सामान बहुत निराशाजनक है :(। मैं आपकी सहायता की सराहना करता हूं
 – 
user1354934
12 फरवरी 2017, 00:59