获取折线以角铯渲染时出现问题

时间:2019-09-16 09:57:32

标签: angular cesium

我正在尝试使用角铯,但是无法在应用程序中获得折线渲染。

我的组件html如下:

<ac-map>
  <ac-layer acFor="let path of paths$" [context]="this">
    <ac-polyline-desc props="{
        position: path.positions,
        width: path.width,
        material: path.material
    }">
    </ac-polyline-desc>
  </ac-layer>
</ac-map>

还有ts来源:

import { Component, OnInit } from '@angular/core';
import { AcNotification, ActionType } from 'angular-cesium';
import { Observable, from } from 'rxjs';
import {map} from 'rxjs/operators';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent implements OnInit {
  paths$: Observable<AcNotification>;

  ngOnInit() {
    const yellowMaterial = new Cesium.Material({
      fabric: {
        type: 'Color',
        uniforms: {
          color: new Cesium.Color(1.0, 1.0, 0.0, 1.0)
        }
      }
    });

    this.paths$ = from([
      {
        id: '1',
        width: 2,
        positions: Cesium.Cartesian3.fromDegreesArray(
          [
            -3.131172, 51.478424,
            18.492839, 51.649888
          ]),
        material: yellowMaterial
      }
    ]).pipe(
      map(path => ({
        id: path.id,
        actionType: ActionType.ADD_UPDATE,
        entity: path
      }))
    );

  }
}

这基于'planes'基本example,我可以正常使用。因此,在尝试使用具有多个点的折线变化时,我一定做错了什么,还是其他愚蠢的事情?

谢谢

1 个答案:

答案 0 :(得分:0)

我无法测试您的代码atm代码,但是在我的应用中,我正在执行类似==

的操作
`<ac-layer acFor="let drone of acDrones$" [context]="this"></ac-layer>`

public acEntity$: Observable<AcNotification>;
private acEntityEmitter: Subject<AcNotification> = new Subject<AcNotification>();

constructor() {
    this.acEntity$ = this.acEntityEmitter.asObservable();
}

addEntity() {
    this.acEntityEmitter.next({
      id: uuid(),
      actionType: ActionType.ADD_UPDATE,
      entity: new AcEntity({
        position,
        orientation
      })
    });
}

也许可以帮助您。如果没有,请发表评论,我会记得尝试一下