test: 添加通视分析和天际线

src/app/app.component.css

 #container {
   position: relative;
 }
+
+.widgets {
+  position: absolute;
+  display: flex;
+  flex-direction: column;
+}

src/app/app.component.html

-<h1>Ng smart3d</h1>
 <div id="container">
-  <app-measure-handler></app-measure-handler>
+  <div class="widgets">
+    <app-measure-handler></app-measure-handler>
+    <app-sight-line></app-sight-line>
+    <app-skyline></app-skyline>
+    <app-layer-manager></app-layer-manager>
+  </div>
 </div>

src/app/app.component.ts

@@ -18,7 +18,8 @@ export class AppComponent implements OnInit {
     this.viewer = this.viewerService.initViewer('container', {
       sceneMode: smart3d.SceneMode.SCENE3D,
       scene3DOnly: true,
-      terrainProvider: smart3d.TerrainManager.createWorldTerrain()
+      terrainProvider: smart3d.TerrainManager.createWorldTerrain(),
+      helper: false,
     });
   }
 }

src/app/app.module.ts

@@ -2,14 +2,20 @@ import { BrowserModule } from '@angular/platform-browser';
 import { NgModule } from '@angular/core';
 
 import { AppComponent } from './app.component';
-import { MeasureHandlerComponent } from './components';
-import { SightLineComponent } from './components/sight-line/sight-line.component';
+import {
+  MeasureHandlerComponent,
+  SightLineComponent,
+  LayerManagerComponent,
+  SkylineComponent,
+} from './components';
 
 @NgModule({
   declarations: [
     AppComponent,
     MeasureHandlerComponent,
     SightLineComponent,
+    LayerManagerComponent,
+    SkylineComponent,
   ],
   imports: [
     BrowserModule

src/app/components/index.ts

 export * from './measure-handler';
 export * from './sight-line';
+export * from './layer-manager';
+export * from './skyline';

src/app/components/layer-manager/index.ts

+export * from './layer-manager.component';

src/app/components/layer-manager/layer-manager.component.html

+<p>layer-manager works!</p>

src/app/components/layer-manager/layer-manager.component.spec.ts

+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { LayerManagerComponent } from './layer-manager.component';
+
+describe('LayerManagerComponent', () => {
+  let component: LayerManagerComponent;
+  let fixture: ComponentFixture<LayerManagerComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ LayerManagerComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(LayerManagerComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/components/layer-manager/layer-manager.component.ts

+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-layer-manager',
+  templateUrl: './layer-manager.component.html',
+  styleUrls: ['./layer-manager.component.css']
+})
+export class LayerManagerComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {
+  }
+
+}

src/app/components/measure-handler/measure-hander.component.ts

@@ -8,10 +8,7 @@ import { ViewerService } from 'src/app/services';
 })
 export class MeasureHandlerComponent implements OnInit {
 
-  public handleMeasure: (measureMode: number, options?: {
-    isGround: boolean;
-    showLabel: boolean;
-  }) => any;
+  public handleMeasure: (measureMode: number, isGround: boolean, showLabel: boolean) => any;
   public measureMode = smart3d.MeasureMode;
 
   constructor(

src/app/components/measure-handler/measure-handler.component.css

-.buttons {
-    position: absolute;
-    top: 20px;
-    left: 20px;
-  }
\ No newline at end of file

src/app/components/measure-handler/measure-handler.component.html

-<div class="buttons">
+<div>
   <button (click)="handleMeasure(measureMode.Distance)">不贴地距离测量</button>
-  <button (click)="handleMeasure(measureMode.Distance, {
-    isGround: true
-  })">贴地距离测量</button>
+  <button (click)="handleMeasure(measureMode.Distance, true)">贴地距离测量</button>
   <button (click)="handleMeasure(measureMode.Area)">不贴地面积测量</button>
-  <button (click)="handleMeasure(measureMode.Area, {
-    isGround: true
-  })">贴地面积测量</button>
+  <button (click)="handleMeasure(measureMode.Area, true)">贴地面积测量</button>
   <button (click)="handleMeasure(measureMode.Angle)">角度测量</button>
   <button (click)="handleMeasure(measureMode.DVH )">空间距离，水平距离，垂直距离模式测量</button>
 </div>
\ No newline at end of file

src/app/components/sight-line/sight-line.component.html

-<p>sight-line works!</p>
+<div>
+  <button (click)="handleSightLine()">通视分析</button>
+</div>
\ No newline at end of file

src/app/components/sight-line/sight-line.component.ts

 import { Component, OnInit } from '@angular/core';
+import { ViewerService } from 'src/app/services';
 
 @Component({
   selector: 'app-sight-line',
@@ -7,9 +8,25 @@ import { Component, OnInit } from '@angular/core';
 })
 export class SightLineComponent implements OnInit {
 
-  constructor() { }
+  constructor(
+    private viewerService: ViewerService,
+  ) { }
 
   ngOnInit() {
   }
 
+  handleSightLine() {
+    const viewer = this.viewerService.viewer;
+    const drawHandler = new smart3d.DrawHandler(viewer, smart3d.DrawMode.Line);
+    const positions = [];
+    drawHandler.anchorEvent.addEventListener(position => {
+      if (positions.push(position) >= 2) {
+        const sightLine = new smart3d.SightLine(viewer.scene, positions[0], positions[1]);
+        drawHandler.clear();
+        drawHandler.destroy();
+        sightLine.build();
+      }
+    });
+    drawHandler.activate();
+  }
 }

src/app/components/skyline/index.ts

+export * from './skyline.component';

src/app/components/skyline/skyline.component.html

+<div>
+  <button (click)="toggleSkyline()">{{ showSkyline ? '关闭' : '开启' }}天际线</button>
+</div>
\ No newline at end of file

src/app/components/skyline/skyline.component.spec.ts

+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { SkylineComponent } from './skyline.component';
+
+describe('SkylineComponent', () => {
+  let component: SkylineComponent;
+  let fixture: ComponentFixture<SkylineComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ SkylineComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(SkylineComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/components/skyline/skyline.component.ts

+import { Component, OnInit } from '@angular/core';
+import { ViewerService } from 'src/app/services';
+
+@Component({
+  selector: 'app-skyline',
+  templateUrl: './skyline.component.html',
+  styleUrls: ['./skyline.component.css']
+})
+export class SkylineComponent implements OnInit {
+
+  public showSkyline = false;
+  private skyline;
+  private oldDepthTestAgainstTerrainValue: boolean;
+
+  constructor(
+    private viewerService: ViewerService,
+  ) { }
+
+  ngOnInit() {
+  }
+
+  toggleSkyline() {
+    this.showSkyline = !this.showSkyline;
+    const viewer = this.viewerService.viewer;
+
+    if (this.showSkyline) {
+      // 需要开启 depthTestAgainstTerrain，天际线才会围住地形，否则会围住 globe
+      this.oldDepthTestAgainstTerrainValue = viewer.scene.globe.depthTestAgainstTerrain;
+      viewer.scene.globe.depthTestAgainstTerrain = true;
+      this.skyline = new smart3d.SkyLine(viewer, {
+        // width: 10,
+        // lineColor: Cesium.Color.GREEN,
+        // strokeDis: 1e9,
+      });
+    } else {
+      this.skyline.destroy();
+      viewer.scene.globe.depthTestAgainstTerrain = this.oldDepthTestAgainstTerrainValue;
+    }
+  }
+
+}

src/app/services/index.ts

 export * from './viewer';
+export * from './layer-manager';

src/app/services/layer-manager/index.ts

+export * from './layer-manager.service';

src/app/services/layer-manager/layer-manager.service.spec.ts

+import { TestBed } from '@angular/core/testing';
+
+import { LayerManagerService } from './layer-manager.service';
+
+describe('LayerManagerService', () => {
+  beforeEach(() => TestBed.configureTestingModule({}));
+
+  it('should be created', () => {
+    const service: LayerManagerService = TestBed.get(LayerManagerService);
+    expect(service).toBeTruthy();
+  });
+});

src/app/services/layer-manager/layer-manager.service.ts

+import { Injectable } from '@angular/core';
+import { ViewerService } from '../viewer';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class LayerManagerService {
+
+  private layerManager;
+
+  constructor(
+    private viewerService: ViewerService
+  ) {
+    console.log(this.viewerService.viewer);
+  }
+}

src/app/services/viewer/viewer.service.ts

@@ -7,6 +7,7 @@ export class ViewerService {
 
   // tslint:disable-next-line: variable-name
   private _viewer;
+  private layerManager;
   private measureHandler;
 
   constructor() {
@@ -21,14 +22,23 @@ export class ViewerService {
   initViewer(container: string | Element, options?: object): object {
     if (!this._viewer) {
       this._viewer = new smart3d.Viewer(container, options || {});
+      this.layerManager = new smart3d.LayerManager(this._viewer);
+
+      // tslint:disable-next-line: no-string-literal
+      window['viewer'] = this._viewer;
     }
     return this._viewer;
   }
 
-  handleMeasure(measureMode: number, options?: {
-    isGround: boolean;
-    showLabel: boolean;
-  }) {
+  addLayer(layer) {
+    this.layerManager.addLayer(layer);
+  }
+
+  flyToLayer(layer) {
+    this.layerManager.flyTo(layer);
+  }
+
+  handleMeasure(measureMode: number, isGround?: boolean, showLabel?: boolean) {
     if (
       measureMode !== smart3d.MeasureMode.Distance &&
       measureMode !== smart3d.MeasureMode.Angle &&
@@ -38,8 +48,11 @@ export class ViewerService {
       throw new Cesium.DeveloperError('measure mode must be one of smart3d.MeasureMode');
     }
 
+    isGround = undefined === isGround ? false : isGround;
+    showLabel = undefined === showLabel ? true : showLabel;
+
     if (this._viewer) {
-      this.measureHandler = new smart3d.MeasureHandler(this.viewer, measureMode, options && options);
+      this.measureHandler = new smart3d.MeasureHandler(this.viewer, measureMode, isGround, showLabel);
       this.measureHandler.activate();
     }
   }