2014-06-05 24 views
5

का उपयोग करते समय GeoJSON पॉइंट नाम और विवरण प्रदर्शित नहीं किया गया है, मैं Google Map Javascript API V3 का उपयोग करना शुरू कर रहा हूं और GeoJSON का उपयोग करके मानचित्र पर मार्कर प्रदर्शित करना चाहता हूं।Google मानचित्र API V3

{ 
    "type": "FeatureCollection", 
    "features": [ 
     { 
      "type": "Feature", 
      "geometry": { 
       "type": "Point", 
       "coordinates": [153.236112, -27.779627] 
      }, 
      "properties": { 
       "name": "[153.236112, -27.779627]", 
       "description": "Timestamp: 16:37:16.293" 
      } 
     }, 
     { 
      "type": "Feature", 
      "geometry": { 
       "type": "Point", 
       "coordinates": [153.230447, -27.777501] 
      }, 
      "properties": { 
       "name": "[153.230447, -27.777501]", 
       "description": "Timestamp: 16:37:26.298" 
      } 
     } 
    ] 
} 

और मेरे जावा स्क्रिप्ट कोड GeoJSON लोड करने के लिए:

var map; 
var marker; 

function initialize() { 
    // Create a simple map. 
    map = new google.maps.Map(document.getElementById('map-canvas'), { 
     zoom: 14, 
     center: ${lastPosition} 
    }); 

    // Load the associated GeoJSON 
    var url = 'fieldDataGeoJSON'; 
    url += '?deviceId=' + deviceId + '&fieldId=' + fieldId; 
    map.data.loadGeoJson(url); 
} 
google.maps.event.addDomListener(window, 'load', initialize); 

नोट: मेरा GeoJSON इस प्रकार है यूआरएल "fieldDataGeoJSON .." GeoJSON देता है, आप पहले से ही पता लगा हो सकता है के रूप में।

यह अच्छी तरह से काम करता है: मानचित्र पर अच्छे स्थान पर मार्कर दिखाए जाते हैं। लेकिन GeoJSON में मौजूद फ़ील्ड "नाम" और "विवरण" मार्कर से जुड़े नहीं हैं, जिसका अर्थ है कि जब मैं मार्कर पर क्लिक करता हूं तो वे प्रदर्शित नहीं होते हैं।

मुझे लगता है कि पहला सवाल यह होगा: "क्या यह समर्थित होना चाहिए?"। यदि नहीं, तो क्या इसका मतलब यह है कि मुझे नाम और विवरण जोड़ने के लिए जियोजसन को पार्स करना है? क्या आपको यह हासिल करने के बारे में कोई संकेत है?

आपकी मदद के लिए अग्रिम धन्यवाद!

+0

यह [दस्तावेज में उदाहरण माउसओवर श्रोता कहते हैं] (https://developers.google.com/maps/documentation/javascript/examples/layer-data-event), तो मैं मान लेंगे कि जब आप ट्रिगर्स करते हैं तो आप एक infowindow जोड़ सकते हैं। – geocodezip

उत्तर

14

सामान्य Google मानचित्र जावास्क्रिप्ट एपीआई v3 event listeners सामान्य, infowindows के रूप में काम करते हैं।

var map; 
var infowindow = new google.maps.InfoWindow(); 

function initialize() { 
    // Create a simple map. 
    map = new google.maps.Map(document.getElementById('map-canvas'), { 
     zoom: 14, 
     center: new google.maps.LatLng(-27.779627,153.236112) 
    }); 
    google.maps.event.addListener(map, 'click', function() { 
     infowindow.close(); 
    }); 

    // Load the associated GeoJSON 
    var url = 'http://www.geocodezip.com/fieldDataGeoJSON.txt'; 
    map.data.loadGeoJson(url); 

    // Set event listener for each feature. 
    map.data.addListener('click', function(event) { 
    infowindow.setContent(event.feature.getProperty('name')+"<br>"+event.feature.getProperty('description')); 
    infowindow.setPosition(event.latLng); 
    infowindow.setOptions({pixelOffset: new google.maps.Size(0,-34)}); 
    infowindow.open(map); 
    }); 
} 
google.maps.event.addDomListener(window, 'load', initialize); 

working example

+0

अहह ... मुझे लगता है कि सबकुछ स्वचालित होगा लेकिन यह सब समझ में आता है। मैं इसे जल्दी से कोशिश करूंगा! आपके उत्तर के लिए धन्यवाद! –

+1

नेट पर इस समाधान की खोज कर रहा है! धन्यवाद – Wilf

संबंधित मुद्दे