Angular Exibindo imagens do Bing Maps

    O Angular IgxBingMapsMapImagery é o serviço de mapeamento de imagens geográficas fornecido pela empresa Microsoft®. Ele fornece 3 estilos de blocos de imagens geográficas do mundo. Este serviço de imagens geográficas pode ser acessado diretamente no site www.bing.com/maps. O componente de mapa Ignite UI for Angular pode exibir imagens geográficas do Bing Maps no conteúdo em segundo plano do mapa usando a IgxBingMapsMapImagery classe.

    Angular Displaying Imagery from Bing Maps Example

    Code Snippet

    O snippet de código a seguir mostra como exibir blocos de imagens geográficas do Bing Maps em Angular IgxGeographicMapComponent usando IgxBingMapsMapImagery a classe.

    <igx-geographic-map #map
        width="100%"
        height="100%"
        zoomable="true" >
    </igx-geographic-map>
    
    import { IgxGeographicMapComponent } from 'igniteui-angular-maps';
    import { IgxBingMapsMapImagery } from 'igniteui-angular-maps';
    // ...
    const tileSource = new IgxBingMapsMapImagery();
    tileSource.apiKey = "YOUR_BING_MAPS_API_KEY";
    tileSource.imageryStyle = BingMapsImageryStyle.AerialWithLabels; // or
    tileSource.imageryStyle = BingMapsImageryStyle.Aerial; // or
    tileSource.imageryStyle = BingMapsImageryStyle.Road;
    
    // resolving BingMaps uri based on HTTP protocol of hosting website
    let tileUri = tileSource.actualBingImageryRestUri;
    const isHttpSecured = window.location.toString().startsWith("https:");
    if (isHttpSecured) {
        tileUri = tileUri.replace("http:", "https:");
    } else {
        tileUri = tileUri.replace("https:", "http:");
    }
    tileSource.bingImageryRestUri = tileUri;
    
    this.map.backgroundContent = tileSource;
    

    Properties

    The following table summarized properties of the IgxBingMapsMapImagery class:

    Nome da propriedade Tipo de propriedade Descrição
    apiKey corda Representa a propriedade para definir uma chave de API necessária para o serviço de imagens do Bing Mapas. Você deve obter essa chave no site da www.bingmapsportal.com.
    imageryStyle BingMapsImageryStyle Representa a propriedade para definir o estilo de mapa de blocos de imagens do Bing Mapas. Essa propriedade pode ser definida com os seguintesBingMapsImageryStyle valores de enumeração:
    • Aéreo - Especifica o estilo de mapa Aéreo sem sobreposição de estrada ou rótulos
    • AerialWithLabels - Especifica o estilo de mapa aéreo com sobreposição de estrada e rótulos
    • Estrada - Especifica o estilo do mapa Estradas sem sobreposição aérea
    bingImageryRestUri corda Representa a propriedade para definir o URI REST do Bing Imagery especificando de onde o TilePath e os SubDomínios virão. Essa é uma propriedade opcional e, se não for especificada, usará o URI REST padrão.
    cultureName corda Representa uma propriedade para definir o nome da cultura para a origem do bloco.
    isDeferredLoad booleano Representa a propriedade que especifica se o serviço do Bing Mapas deve ou não ser inicializado automaticamente após a atribuição de valores de propriedade válidos.
    isInitialized booleano Representa a propriedade definida como True que ocorre quando os blocos de imagens geográficas do serviço Bing Maps foram inicializados e estão prontos para renderização no componente de mapa.
    subDomains SubDomainsCollection Representa uma coleção de imagens de subdomínios de URI
    tilePath corda Representa uma propriedade que define o URI da imagem do bloco do mapa, esse é o local real do Bing Maps

    API References