Google Map API V3: วิธีเพิ่มข้อมูลที่กำหนดเองให้กับเครื่องหมาย

117

มีวิธีใดบ้างที่ฉันสามารถเพิ่มข้อมูลที่กำหนดเองลงในเครื่องหมายเพื่อใช้ในภายหลังได้ มีหลายวิธีในการมีหน้าต่างข้อมูลและชื่อเรื่อง แต่ถ้าฉันต้องการเชื่อมโยงเครื่องหมายกับข้อมูลอื่น ๆ

ฉันมีสิ่งอื่น ๆ ที่แสดงบนหน้าซึ่งขึ้นอยู่กับเครื่องหมายดังนั้นเมื่อเครื่องหมายถูกคลิกเนื้อหาบนหน้าจะต้องเปลี่ยนไปขึ้นอยู่กับว่าเครื่องหมายใดถูกคลิกฉันต้องการจัดเก็บและเรียกข้อมูลที่กำหนดเองเมื่อเครื่องหมายถูกให้พูด คลิกเป็นต้น

ขอบคุณ

google-maps google-maps-api-3 google-maps-markers

— Abid
แหล่งที่มา

214

เนื่องจาก Google Marker เป็นวัตถุ JavaScript คุณสามารถเพิ่มข้อมูลที่กำหนดเองในแบบฟอร์มkey: valueโดยที่คีย์เป็นสตริงที่ถูกต้อง พวกเขาเรียกว่าคุณสมบัติของวัตถุและสามารถเข้าถึงได้หลายวิธี ค่าอาจเป็นอะไรก็ได้ตามกฎหมายง่ายๆเพียงแค่ตัวเลขหรือสตริงและฟังก์ชันหรือแม้แต่วัตถุอื่น ๆ สามวิธีง่ายๆ: ในการประกาศสัญกรณ์จุดและวงเล็บเหลี่ยม

var markerA = new google.maps.Marker({
    map: map,
    position: new google.maps.LatLng(0, 0),
    customInfo: "Marker A"
});

var markerB = new google.maps.Marker({
    map: map,
    position: new google.maps.LatLng(-10, 0)
});
markerB.customInfo = "Marker B";

var markerC = new google.maps.Marker({
    map: map,
    position: new google.maps.LatLng(-20, 0)
});
markerC['customInfo'] = "Marker C";

จากนั้นเพื่อดึงข้อมูลในลักษณะที่คล้ายกัน:

google.maps.event.addListener(markerA, 'click', function() {
    alert(this.customInfo);
});

— Tina CG Hoehr
แหล่งที่มา

3

ไม่มีสิ่งใดในเอกสารที่ระบุรูปแบบนี้ หวังว่าพวกเขาจะทำมากกว่าทำลายมันในเวอร์ชันที่ใหม่กว่า

— Adam

1

คุณสมบัติ 'customInfo' ไม่มีอยู่ในประเภท 'Marker'

— alehn96

1

หากคุณใช้ typescript คุณอาจต้องการใช้วงเล็บแทนจุดเพื่อกำหนดคุณสมบัติดังกล่าว

— Cocoduf

14

คุณสามารถเพิ่มคุณสมบัติที่กำหนดเองของคุณเองลงในเครื่องหมายได้ (ระวังอย่าให้ขัดแย้งกับคุณสมบัติของ API)

— geocodezip
แหล่งที่มา