Comment faire passer KML dans la couche AC en césium angulaire

Question

J'ai une application angulaire-césium, et j'essaie de diffuser des données kml dans la couche de globe. Je ne peux pas trouver de tutoriels ou d'aide dans les documents angulaires-césium.

voici ce que j'ai jusqu'à présent:

app.ts

import { KmlService } from './kml.service'; 
import { Component, OnInit, AfterViewInit } from '@angular/core'; 
import { CesiumService, MapsManagerService } from 'angular-cesium'; 

import 'rxjs/add/operator/map'; 

@Component({ 
    selector: 'app-root', 
    templateUrl: './app.component.html', 
    styleUrls: ['./app.component.css'] 
}) 
export class AppComponent implements OnInit, AfterViewInit { 
    cesiumViewer; 
    kml$; 

    constructor(private Cesium: CesiumService, 
       private viewersManager: MapsManagerService, 
       private kmlService: KmlService) {} 

    ngOnInit() { 
    // console.log(this.cesiumViewer); 
    } 

    ngAfterViewInit() { 
    this.kml$ = this.kmlService.getKml() 
     .map((data) => data); 
    } 
} 

app.html

<ac-map id="main-map"> 
    <ac-layer acFor="let kml of kml$"> 
    </ac-layer> 
</ac-map> 

kml.service

import { Injectable } from '@angular/core'; 
import { HttpClient } from '@angular/common/http' 

@Injectable() 
export class KmlService { 

    constructor(private http: HttpClient) { } 

    getKml() { 
    return this.http.get('http://172.16.1.254:8080/rest/kml/accept/all', { observe : 'body', responseType : 'text'}); 
    } 

} 

la sortie est kml comme ça:

<?xml version="1.0" encoding="UTF-8"?> 
<kml xmlns="http://www.opengis.net/kml/2.2"> 
<Document> 

<Style id="highlightAccepted"><IconStyle><Icon><href>http://maps.google.com/mapfiles/kml/paddle/grn-stars.png</href></Icon></IconStyle></Style> 
<Style id="normalAccepted"> <IconStyle><Icon><href>http://maps.google.com/mapfiles/kml/paddle/grn-blank.png</href></Icon></IconStyle></Style> 
<Style id="highlightDropped"> <IconStyle><Icon><href>http://maps.google.com/mapfiles/kml/paddle/red-stars.png</href></Icon></IconStyle></Style> 
<Style id="normalDropped"> <IconStyle><Icon><href>http://maps.google.com/mapfiles/kml/paddle/red-blank.png</href></Icon></IconStyle></Style> 
<Style id="highlightHome"> <IconStyle><Icon><href>http://maps.google.com/mapfiles/kml/shapes/flag.png</href>  </Icon></IconStyle></Style> 
<Style id="normalHome">  <IconStyle><Icon><href>http://maps.google.com/mapfiles/kml/shapes/flag.png</href>  </Icon></IconStyle></Style> 

<StyleMap id="acceptedStyleMap"> 
<Pair><key>normal</key><styleUrl>#normalAccepted</styleUrl></Pair> 
<Pair><key>highlight</key><styleUrl>#highlightAccepted</styleUrl></Pair> 
</StyleMap> 

...etc... 

cette erreur, que je suppose des moyens que je fais tout ce totalement faux:

ERROR Error: ac-layer: must initialize [context] 
    at AcLayerComponent.webpackJsonp.../../../../angular-cesium/bundles/angular-cesium.umd.js.AcLayerComponent.initValidParams (angular-cesium.umd.js:2670) 

Answer 1

actuellement ne marche pas support angulaire césium KML en tant que composant angulaire. mais vous pouvez utiliser l'API pure au césium.

class YourComponent { 
constructor(private mapsManagerService: MapsManagerService) { 
    const viewer = mapsManagerService.getMap().getCesiumViewer() 
    viewer.dataSources.add(
    Cesium.KmlDataSource.load(
     '../../SampleData/kml/bikeRide.kml',options 
    ) 
    ) 
    } 
} 

répondu ici: https://github.com/TGFTech/angular-cesium/issues/123