查看 Cesium的官方例子,《Particle System Tails.html》,其中有个地方让我困惑:
var forceFunction = function (options, iteration) {
return function (particle, dt) {
dt = Cesium.Math.clamp(dt, 0.0, 0.05);
scratchCartesian3 = Cesium.Cartesian3.normalize(
particle.position,
new Cesium.Cartesian3()
);
scratchCartesian3 = Cesium.Cartesian3.multiplyByScalar(
scratchCartesian3,
-40.0 * dt,
scratchCartesian3
);
scratchCartesian3 = Cesium.Cartesian3.add(
particle.position,
scratchCartesian3,
scratchCartesian3
);
scratchCartographic = Cesium.Cartographic.fromCartesian(
scratchCartesian3,
Cesium.Ellipsoid.WGS84,
scratchCartographic
);
var angle =
(Cesium.Math.PI * 2.0 * iteration) / options.numberOfSystems;
iteration += options.iterationOffset;
scratchCartographic.longitude +=
Math.cos(angle) * options.cartographicStep * 30.0 * dt;
scratchCartographic.latitude +=
Math.sin(angle) * options.cartographicStep * 30.0 * dt;
particle.position = Cesium.Cartographic.toCartesian(
scratchCartographic
);
};
};
iteration 是number类型的变量,这样修改,真的可以吗?结果真的可以,应该是闭包的概念没弄清,一直以为这样改不了。
写个demo, 记录一下,验证一下
function foo(val, name) {
return function () {
console.log(name + ": " + val);
val++;
}
}
let a = 0, b = 1;
let fooA = foo(a, 'a'), fooB = foo(b, 'b');
fooA(), fooA(), fooA(), fooB(), fooB();
console.log(a, b)
《Imagery Color To Alpha.html》也不是容易弄懂的,看了源码,才明白
ImageryLayer.js 的 colorToAlpha 和 colorToAlphaThreshold,两个属性的用法,
直接上代码:
GlobeSurfaceTileProvider.js
// Update color to alpha
var colorToAlpha =
uniformMapProperties.colorsToAlpha[numberOfDayTextures];
if (!defined(colorToAlpha)) {
colorToAlpha = uniformMapProperties.colorsToAlpha[
numberOfDayTextures
] = new Cartesian4();
}
var hasColorToAlpha =
defined(imageryLayer.colorToAlpha) &&
imageryLayer.colorToAlphaThreshold > 0.0;
applyColorToAlpha = applyColorToAlpha || hasColorToAlpha;
if (hasColorToAlpha) {
var color = imageryLayer.colorToAlpha;
colorToAlpha.x = color.red;
colorToAlpha.y = color.green;
colorToAlpha.z = color.blue;
colorToAlpha.w = imageryLayer.colorToAlphaThreshold;
} else {
colorToAlpha.w = -1.0;
}
GlobeFS.glsl
#ifdef APPLY_COLOR_TO_ALPHA
vec3 colorDiff = abs(color.rgb - colorToAlpha.rgb);
colorDiff.r = max(max(colorDiff.r, colorDiff.g), colorDiff.b);
alpha = czm_branchFreeTernary(colorDiff.r < colorToAlpha.a, 0.0, alpha);
#endif
branchFreeTernary.glsl
/**
* Branchless ternary operator to be used when it's inexpensive to explicitly
* evaluate both possibilities for a float expression.
*
* @name czm_branchFreeTernary
* @glslFunction
*
* @param {bool} comparison A comparison statement
* @param {float} a Value to return if the comparison is true.
* @param {float} b Value to return if the comparison is false.
*
* @returns {float} equivalent of comparison ? a : b
*/
float czm_branchFreeTernary(bool comparison, float a, float b) {
float useA = float(comparison);
return a * useA + b * (1.0 - useA);
}
在例子《Imagery Color To Alpha.html》中,定义了两个影像图层,图层baseLayer在最下面,图层singleTileLayer在最上面,当colorToAlphaThreshold为 0,则singleTileLayer完全覆盖baseLayer;当colorToAlphaThreshold 为1,则singleTileLayer完全透明,不可见,只显示baseLayer.
baseLayer.colorToAlpha = new Cesium.Color(0.0, 0.016, 0.059); 也比较让人困惑,实际上大概是颜色 ‘#00040F’,就是说把它改为
baseLayer.colorToAlpha = new Cesium.Color(0.0, 0.0, 0.0);
运行效果几乎没有区别,还有两个地方值得改一下,看看效果
var viewModel = {
threshold: baseLayer.colorToAlphaThreshold,
};
Cesium.knockout
.getObservable(viewModel, "threshold")
.subscribe(function (newValue) {
baseLayer.colorToAlphaThreshold = parseFloat(
viewModel.threshold
);
}); //Sandcastle_End
两个地方的 singleTileLayer 改为 baseLayer