Skip to main content
cancel
Showing results for 
Search instead for 
Did you mean: 

Find everything you need to get certified on Fabric—skills challenges, live sessions, exam prep, role guidance, and more. Get started

Reply
mrichardson07
New Member

azure map - how to add custom image at specific locations

Hi - I am using a bubble layer to represent customers on an azure map. How do I add our logo to our store locations? 

 

Is it a symbol layer? I am new to Power BI, so any help is appreciated. 

 

 

1 REPLY 1
v-yiruan-msft
Community Support
Community Support

Hi @mrichardson07 ,

The following link is the thread which has the similar requirement as yours, hope it can help you.

Can't get custom images to display in Azure Maps as Symbols - Stack Overflow

Here is what ended up working for me. I worked with Microsoft Support on this. locationData contains the image, longitude and latitude. The min and max of both longitude and latitude is passed in as well to set the camera boundry. The biggest issue with my original code was setting iconOptions size to 0.5. The plugin did not like that. It's now set to 1.

function addMarkerSymbols(locationData, min_long, min_lat, max_long, max_lat)
    {

        map.setCamera({
            bounds: [min_long, min_lat, max_long, max_lat],
            padding: 50
        });

        $.each(locationData, function (i, item)
        {

            map.imageSprite.add('default-icon' + i, item.locationImage);
            //Create a data source and add it to the map.
            var datasource = new atlas.source.DataSource();
            map.sources.add(datasource);

            //Add a data set to the data source.
            datasource.add(new atlas.data.Feature(new atlas.data.Point([item.longitude, item.latitude]), null));

            //Create a symbol layer to render the points.
            layer = new atlas.layer.SymbolLayer(datasource, null, {
                iconOptions: {
                    //The map control has built in icons for bar, coffee and restaurant that we can use.
                    image: 'default-icon' + i,
                    anchor: 'center',
                    allowOverlap: true,
                    size: 1
                }
            });
            map.layers.add(layer);

        });

    }

Best Regards

Community Support Team _ Rena
If this post helps, then please consider Accept it as the solution to help the other members find it more quickly.

Helpful resources

Announcements
Sept PBI Carousel

Power BI Monthly Update - September 2024

Check out the September 2024 Power BI update to learn about new features.

September Hackathon Carousel

Microsoft Fabric & AI Learning Hackathon

Learn from experts, get hands-on experience, and win awesome prizes.

Sept NL Carousel

Fabric Community Update - September 2024

Find out what's new and trending in the Fabric Community.

Top Solution Authors