2.9.1 • Published 1 year ago

nsc-earth v2.9.1

Weekly downloads
109
License
ISC
Repository
-
Last release
1 year ago

安装

cnpm/npm i nsc-earth

引用

nsc-earth包含封装Cesium的React组件-NSCEarthUI,包含一个Controller类-NSCEarth 通过实例化NSCEarthUI组件,返回一个NSCEarth实例,引用方式如下: NSCEarthUI组件有两个属性,一个是Cesium类,一个是onLoad回调函数,当NSCEarthUI实例化完成后,返回NSCEarth实例,后续所有的操作都基于NSCEarth实例;

import NSCEarthUI from 'nsc-earth';
···
  handleNSCEarthUILoad(NSCEarth) {
    this.NSCEarth = NSCEarth;
  }

## 功能
#### 1.定位
##### 相机参数定位
```javascript
//设置相机的经纬度和高,默认相机俯视
const cameraView = {
      position: {
        x: 110.5,
        y: 26.0,
        z: 3000
      }
    };
 this.NSCEarth.setView(cameraView);
定位至实体
//target可以是entity、Array<Entity>、图层的datasource等
 this.NSCEarth.flyTo(target);

图层

引入GraphicLayer图层类,实例一个图层需要name和geojson对象两个参数,geojson可以是文件路径,也可以是一个json对象,图层实例化完成后,调用onLoad回调函数返回layer对象,然后将图层对象通过NSCEarth.addLayer添加至三维场景中。

import { GraphicLayer } from 'nsc-earth';

const layer = new GraphicLayer('test', '/map.geojson'); layer.onLoad.addEventListener(resultLayer => { this.NSCEarth.addLayer(resultLayer); });

//获取所有图层,返回Array this.NSCEarth.layers

//控制图层显隐 layer.show=true/false; //缩放至图层 NSCEarth.flyTo(layer.dataSource) //获取图层所有entity,返回一个Array layer.values //图层名称 layer.name

## 事件
#### 绑定事件和取消绑定

//添加鼠标事件绑定 const mouseHandle = this.NSCEarth.LEFT_CLICK.addEventListener(result => { console.log('LEFT_CLICK mouseHandle', result); }); //移除事件绑定 mouseHandle();

//添加相机事件绑定 this.Camera_MoveEndHandler = NSCEarth.Camera_MoveEnd.addEventListener((camera) => { //camera }); //移除事件绑定 this.Camera_MoveEndHandler();

##### 鼠标事件列表

* LEFT_CLICK
* LEFT_CLICK
* LEFT_DOUBLE_CLICK
* LEFT_DOWN
* LEFT_UP
* MIDDLE_CLICK
* MIDDLE_DOWN
* MIDDLE_UP
* MOUSE_MOVE

##### 相机事件列表

* Camera_MoveStart
* Camera_MoveEnd
* Camera_Changed


## 拾取
>在三维球上点击,返回点击位置所有的entity

1.绑定地球单击事件,返回{ screenPoint, mapPoint }对象

this.mouseHandle = NSCEarth.LEFT_CLICK.addEventListener(({ screenPoint, mapPoint }) => {       //screenPoint mapPoint     })

2.NSCEarth.hitTest方法返回hitTestResult对象,包含screenPoint、ground、results属性,
其中results为Array<Entity>

const hitTestResult = NSCEarth.hitTest(screenPoint);

## 插件机制
>插件实质为一个React组件,当你将一个React组件作为插件添加时,你可以定义一个位置,如下图所示:
![3f8dfb075ca2a831dcc412eb517f79fe.png](en-resource://database/1189:1)
当一个React组件添加至场景中,会给组件的props中添加一个NSCEarth属性:

componentDidMount() {     const { NSCEarth } = this.props;

#### 添加插件

this.NSCEarth.addWidget('HomeWidget', HomeWidget, 'bottom-right', { cameraView }).then(widget => {       console.log('HomeWidget is loaded.');     }).catch(error => {       console.log(error);     });

#### 移除插件

NSCEarth.removeWidget('HomeWidget');

2.9.1

1 year ago

2.9.0

1 year ago

2.8.9

1 year ago

2.8.8

1 year ago

2.8.7

2 years ago

2.8.6

2 years ago

2.8.5

2 years ago

2.8.1

2 years ago

2.8.0

2 years ago

2.7.0

2 years ago

2.7.2

2 years ago

2.7.1

2 years ago

2.8.3

2 years ago

2.8.2

2 years ago

2.8.4

2 years ago

2.6.1

2 years ago

2.6.3

2 years ago

2.6.2

2 years ago

2.7.4

2 years ago

2.7.3

2 years ago

2.7.6

2 years ago

2.7.5

2 years ago

2.7.8

2 years ago

2.7.7

2 years ago

2.7.9

2 years ago

2.6.5

2 years ago

2.6.4

2 years ago

2.6.7

2 years ago

2.6.6

2 years ago

2.6.9

2 years ago

2.5.0

2 years ago

0.0.93

4 years ago

0.0.92

4 years ago

0.0.91

4 years ago

0.0.90

4 years ago

0.0.89

4 years ago

0.0.87

4 years ago

0.0.88

4 years ago

0.0.86

4 years ago

0.0.85

4 years ago

0.0.84

4 years ago

0.0.83

4 years ago

0.0.82

4 years ago

0.0.80

4 years ago

0.0.81

4 years ago

0.0.79

5 years ago

0.0.78

5 years ago

0.0.76

5 years ago

0.0.77

5 years ago

0.0.75

5 years ago

0.0.74

5 years ago

0.0.73

5 years ago

0.0.71

5 years ago

0.0.72

5 years ago

0.0.70

5 years ago

0.0.69

5 years ago

0.0.67

5 years ago

0.0.68

5 years ago

0.0.66

5 years ago

0.0.65

5 years ago

0.0.63

5 years ago

0.0.64

5 years ago

0.0.62

5 years ago

0.0.61

5 years ago

0.0.60

5 years ago

0.0.59

5 years ago

0.0.58

5 years ago

0.0.56

5 years ago

0.0.57

5 years ago

0.0.55

5 years ago

0.0.54

5 years ago

0.0.52

5 years ago

0.0.53

5 years ago

0.0.51

5 years ago

0.0.50

5 years ago

0.0.49

5 years ago

0.0.47

5 years ago

0.0.48

5 years ago

0.0.46

5 years ago

0.0.45

5 years ago

0.0.44

5 years ago

0.0.43

5 years ago

0.0.42

5 years ago

0.0.41

5 years ago

0.0.40

5 years ago

0.0.39

5 years ago

0.0.38

5 years ago

0.0.37

5 years ago

0.0.36

5 years ago

0.0.35

5 years ago

0.0.34

5 years ago

0.0.33

5 years ago

0.0.30

5 years ago

0.0.31

5 years ago

0.0.32

5 years ago

0.0.29

5 years ago

0.0.28

5 years ago

0.0.26

5 years ago

0.0.25

5 years ago

0.0.24

5 years ago

0.0.23

5 years ago

0.0.22

5 years ago

0.0.21

5 years ago

0.0.20

5 years ago

0.0.19

5 years ago

0.0.17

5 years ago

0.0.18

5 years ago

0.0.16

5 years ago

0.0.15

5 years ago

0.0.14

5 years ago

0.0.13

5 years ago

0.0.12

5 years ago

0.0.11

5 years ago

0.0.10

5 years ago

0.0.9

5 years ago

0.0.8

5 years ago

0.0.7

5 years ago

0.0.6

5 years ago

0.0.5

5 years ago

0.0.4

5 years ago

0.0.3

5 years ago

0.0.2

5 years ago

0.0.1

5 years ago