none
How to show infobox for shapes loaded using Microsoft.Maps.GeoJson.read RRS feed

  • Question

  • Hi

    I am hoping someone can help. I have managed to import my geojson file into a bing map but I would like to show the properties in an infobox when the user clicks on a pushpin.

    I have enabled a click event which is working but I cannot work out where to access the properties that I loaded from my KML data

    An example of one of my pushpins in the GEOJSON file:

            {
                "type": "Feature",
                "geometry": {
                    "type": "Point",
                    "coordinates": [
                        -0.1209,
                        52.55062,
                        0
                    ]
                },
                "properties": {
                    "name": "30872 - Test",
                    "styleUrl": "#pin_wtg",
                    "styleHash": "-17026401",
                    "styleMapHash": {
                        "normal": "#s_pin_wtg",
                        "highlight": "#s_pin_wtg_hl"
                    },
                    "icon": "pin_wtg.png",
                    "Functional Loc": "SX-58758-001",
                    "Name": "Test Location",
                }
            }


    Here is an example I found for accessing the metadata but I am unsure where the properties are actually loaded to, are they even loaded to metadata?

        function pushpinClicked(e) {
            //Make sure the infobox has metadata to display.
            if (e.target.metadata) {
                //Set the infobox options with the metadata of the pushpin.
                infobox.setOptions({
                    location: e.target.getLocation(),
                    title: e.target.metadata.title,
                    description: e.target.metadata.description,
                    visible: true
                });
            }
        }

    As you can see I am struggling with this so any help is appreciated.

    I am looking for something like this:

        function pushpinClicked(e) {
            //Make sure the infobox has metadata to display.
            if (e.target.properties) {
                //Set the infobox options with the metadata of the pushpin.
                infobox.setOptions({
                    location: e.target.getLocation(),
                    title: e.target.properties.name,
                    Functional Loc: e.target.properties.FunctionalLoc,
                    visible: true
                });
            }
        }

    • Edited by retrohead Tuesday, November 20, 2018 4:06 PM more info
    Tuesday, November 20, 2018 4:03 PM

All replies