Angular Displaying Imagery from Open Street Maps

    The Angular IgxOpenStreetMapImagery is a free geographic imagery mapping service created collaboratively by OpenStreetMap© contributors from around the world. It provides geographic imagery tiles of the world only in road map style without any configuration options. This geographic imagery service can be accessed directly on www.OpenStreetMap.org web site. By the default, the Ignite UI for Angular map component already displays geographic imagery from the Open Street Maps. Therefore, there is no need to configure the control to display geographic imagery from the Open Street Maps.

    Angular Displaying Imagery from Open Street Maps Example

    Code Snippet

    This code example explicitly sets BackgroundContent of the map component to the IgxOpenStreetMapImagery object which provides geographic imagery from OpenStreetMap© contributors.

    <igx-geographic-map #map
        width="100%"
        height="100%"
        zoomable="true" >
    </igx-geographic-map>
    
    import { IgxGeographicMapComponent } from 'igniteui-angular-maps';
    import { IgxOpenStreetMapImagery } from 'igniteui-angular-maps';
    // ...
    public map: IgxGeographicMapComponent;
    
    const tileSource = new IgxOpenStreetMapImagery();
    this.map.backgroundContent = tileSource;
    

    API References