Cesium.js 让人困惑的代码 1

查看 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

你可能感兴趣的:(3D,编程)