pickPosition with alpha cut off?

jsal11 · January 18, 2019, 3:16pm

Hi!

Could someone help me on this challenge I am struggling with:

I want to use scene.pickPosition to pick position only if alpha-value is lower than 0.3. So any “too transparent” result should be ignored.

I see “alpha cut off” type implementation in the source code, but do not really understand could I utilize it for this task… It would be fine to modify some GLSL shader globally to render pickDepthBuffer like this, but I don’t seem to find the right place to edit the code.

This is how I pick now:

scene.pickTranslucentDepth = true;

// TODO: Setup something here to discard fragments where color.a < 0.3

scene.render();

tempScenePos = pickGlobe(controller, controller._aggregator._currentMousePosition, tempScenePos);

scene.pickTranslucentDepth = false;

Thanks!

omar · January 23, 2019, 2:12pm

There’s nothing built it in to do this, but this is the line you’d have to edit:

github.com

CesiumGS/cesium/blob/master/Source/Scene/DerivedCommand.js#L262


        '    czm_non_pick_main(); \n' +
        '    if (gl_FragColor.a == 0.0) { \n' +
        '        discard; \n' +
        '    } \n' +
        '    gl_FragColor = ' + pickId + '; \n' +
        '} \n';
    var newSources = new Array(length + 1);
    for (var i = 0; i < length; ++i) {
        newSources[i] = ShaderSource.replaceMain(sources[i], 'czm_non_pick_main');
    }
    newSources[length] = newMain;
    fs = new ShaderSource({
        sources : newSources,
        defines : fs.defines
    });
    shader = context.shaderCache.createDerivedShaderProgram(shaderProgram, 'pick', {
        vertexShaderSource : shaderProgram.vertexShaderSource,
        fragmentShaderSource : fs,
        attributeLocations : attributeLocations
    });
}

to change == 0 to <= 0.3.

That might not work for everything since some things have custom pick shaders. Let me know how it goes!

jsal11 · January 25, 2019, 6:16pm

Actually the one you posted solves the pick! But not the “pickPosition”. Pick is for entityId:s I think?

Anyways… I have been investigating this and I think it needs a special case in 3d tileset shader code.

My next question would be: How can I pass a custom uniform to Cesium 3d tileset shader pipeline?

Or, a broader version of the same: how can I pass a custom shader to 3d tileset?

omar · January 28, 2019, 4:28pm

I think that depends on what type of content is in your 3D Tiles. For example, if you’ve got buildings that are b3dm, then they’ll be created as Batched3DModelTileContent:

github.com

CesiumGS/cesium/blob/master/Source/Scene/Batched3DModel3DTileContent.js

import Cartesian3 from '../Core/Cartesian3.js';
import Color from '../Core/Color.js';
import ComponentDatatype from '../Core/ComponentDatatype.js';
import defaultValue from '../Core/defaultValue.js';
import defined from '../Core/defined.js';
import deprecationWarning from '../Core/deprecationWarning.js';
import destroyObject from '../Core/destroyObject.js';
import DeveloperError from '../Core/DeveloperError.js';
import getStringFromTypedArray from '../Core/getStringFromTypedArray.js';
import Matrix4 from '../Core/Matrix4.js';
import RequestType from '../Core/RequestType.js';
import RuntimeError from '../Core/RuntimeError.js';
import Pass from '../Renderer/Pass.js';
import Axis from './Axis.js';
import Cesium3DTileBatchTable from './Cesium3DTileBatchTable.js';
import Cesium3DTileFeature from './Cesium3DTileFeature.js';
import Cesium3DTileFeatureTable from './Cesium3DTileFeatureTable.js';
import ClassificationModel from './ClassificationModel.js';
import Model from './Model.js';
import ModelUtility from './ModelUtility.js';

This file has been truncated. show original

Which uses the Model class (https://github.com/AnalyticalGraphicsInc/cesium/blob/master/Source/Scene/Batched3DModel3DTileContent.js#L369) to create its content. So you could potentially add in a custom material there.