Cesium-knockout的使用

发表于

更新于

阅读量

Cesium.knockout能够使Cesium球体监听html控件, 从而根据控件的值实时改变一些地图属性.

创建html控件

<div class="toolbar">
	<div>Height</div>
	<input type="range" min="0" max="100.0" step="1" data-bind="value: pixelSize, valueUpdate: 'input'">
	<input type="text" size="5" data-bind="value: pixelSize">
</div>

利用data-bind在控件中绑定属性

创建viewmodel

var viewmodel = {
    pixelSize:10
}

利用kncokout将属性绑定控件

Cesium.knockout.track(viewmodel)
var toolbar = document.querySelector('.toolbar')
Cesium.knockout.applyBindings(viewmodel,toolbar)
Cesium.knockout.getObservable(viewmodel, 'pixelSize').subscribe(function(pixelSize) {
    console.log(pixelSize)
    entityt.point.pixelSize = pixelSize
});