如何在运行时修改地形的比例?

参照 arcgis js sdk 中的 Custom ElevationLayer - Exaggerating elevation 例子, 用 TypeScript 实现了一个  ExaggeratedElevationLayer , 可以根据 exaggeration 属性来设置地形缩放的比例, 代码如下:
import {
subclass, declared, property
} from "esri/core/accessorSupport/decorators";
import BaseElevationLayer = require('esri/layers/BaseElevationLayer');
import ElevationLayer = require('esri/layers/ElevationLayer');

@subclass('beginor.ExaggeratedElevationLayer')
class ExaggeratedElevationLayer extends(declared(BaseElevationLayer)) {

@property()
public exaggeration: number;
@property()
public url: string;
@property()
public get type(): string { return 'exaggerated-elevation'; }

private elevation: ElevationLayer;

constructor(properties: ExaggeratedElevationLayerProperties) {
super(properties);
if (!this.exaggeration) {
this.exaggeration = 1.0;
}
}

public load(signal: AbortSignal): IPromise<any> {
this.elevation = new ElevationLayer({
url: this.url
});
return this.addResolvingPromise(this.elevation.load(signal));
}

fetchTile(
level: number,
row: number,
column: number,
options: __esri.ElevationLayerFetchTileOptions
): IPromise<__esri.ElevationTileData> {
return this.elevation.fetchTile(level, row, column, options).then(
data => {
const exag = this.exaggeration;
for (let i = 0; i < data.values.length; i++) {
data.values[i] = data.values[i] * exag;
}
return data;
}
);
}

}

interface ExaggeratedElevationLayerProperties extends __esri.BaseElevationLayerProperties {
url: string;
exaggeration?: number;
}

export = ExaggeratedElevationLayer;
在项目中使用它的代码如下:
import WebScene = require('esri/Map');
import SceneView = require('esri/views/SceneView');
import externalRenderers = require('esri/views/3d/externalRenderers');

import ExaggeratedElevationLayer = require('beginor/ExaggeratedElevationLayer');

const map = new WebScene({
basemap: 'streets',
ground: {
layers: [
new ExaggeratedElevationLayer({
url: 'http://elevation3d.arcgis.com/arcgis/rest/services/WorldElevation3D/Terrain3D/ImageServer',
exaggeration: 5
})
]
}
});

const view = new SceneView({
map: map,
container: 'viewDiv',
center: [113.2, 23.4],
zoom: 13,
camera: {
position: {
spatialReference: { wkid: 102100 },
x: 12601020.732296046,
y: 2661706.7320940713,
z: 10515.040601080284
},
heading: 0,
tilt: 60
}
});
现在, 需要在运行时修改地形的缩放比例, 通过从当前场景中找到这个地形图层, 修改 exaggeration 属性, 并没有效果。 我找到的唯一方法是将地形图层删掉再重新添加到场景中, 示例代码如下:
var btnTgl = document.getElementById('eleTgl') as HTMLButtonElement;
btnTgl.addEventListener('click', e => {
const ground = view.map.ground;
var eleLayer = ground.layers.getItemAt(0);
ground.layers.remove(eleLayer);
let exLayer = eleLayer as any as ExaggeratedElevationLayer;
if (exLayer.exaggeration == 5) {
exLayer = new ExaggeratedElevationLayer({
exaggeration: 1,
url: exLayer.url
});
}
else {
exLayer = new ExaggeratedElevationLayer({
exaggeration: 5,
url: exLayer.url
});
}
ground.layers.add(exLayer as any);
});
这个方法虽然可行,但是用户体验比较差, 需要重新构建地形,而且还需要重新下载大量的高程数据。  所以,请问有没有什么更加高效的方法可以修改地形的缩放比例呢, 比如如何触发地形图层的重新渲染,而不是重新构建地形?
已邀请:

要回复问题请先登录注册