Open Street Maps에서 이미지 표시 Angular

    Angular IgxOpenStreetMapImagery는 전 세계의 OpenStreetMap© 기여자들이 공동으로 만든 무료 지리적 이미지 매핑 서비스입니다. 구성 옵션 없이 도로 지도 스타일로만 세계의 지리적 이미지 타일을 제공합니다. 이 지리적 이미지 서비스는 www.OpenStreetMap.org 웹 사이트에서 직접 액세스할 수 있습니다. 기본적으로 Ignite UI for Angular 맵 구성 요소는 이미 Open Street Maps의 지리적 이미지를 표시합니다. 따라서 Open Street Maps의 지리적 이미지를 표시하도록 컨트롤을 구성할 필요가 없습니다.

    Open Street Maps에서 이미지를 표시하는 Angular 예제

    EXAMPLE

    이 샘플이 마음에 드시나요? 전체 Ignite UI for Angular 툴킷에 액세스하고 몇 분 안에 나만의 앱을 구축해 보세요. 무료로 다운로드하세요.

    코드 조각

    이 코드 예제에서는 지도 구성 요소의 BackgroundContent OpenStreetMap© 기여자의 지리 이미지를 제공하는 IgxOpenStreetMapImagery 객체로 명시적으로 설정합니다.

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

    API 참조