Why does't work my custom shader?

CesiumJS
1

I’m creating my custom shader to make a dotted line, since PolylineDash moves and scales when the camera moves. Why my shader is not working and who can tell me how to achieve my goal?

let countyBorderPrimitive = new GroundPolylinePrimitive({
                    geometryInstances: new GeometryInstance({
                        geometry: new GroundPolylineGeometry({
                            positions: Cartesian3.fromDegreesArray(newBorPos),
                            width: 3,
                        })
                    }),
                    show: stores.ggStore.visibleStatus,
                    appearance: new PolylineMaterialAppearance({
                        translucent: false,
                        material: Material.fromType('Color', {
                            color: new Color(1.0, 0.0, 0.0, 1.0)
                        }),
                        vertexShaderSource: `
                        attribute vec3 position3DHigh;
                        attribute vec3 position3DLow;
                        attribute vec2 st;
                        attribute float batchId;

                        uniform mat4 modelViewProjection;
                        uniform vec3 eyeOffset;

                        varying vec2 v_st;
                        varying float v_batchId;

                        void main() {
                            vec4 p = czm_translateRelativeToEye(position3DHigh, position3DLow, eyeOffset);
                            gl_Position = modelViewProjection * p;
                            v_st = st;
                            v_batchId = batchId;
                        }
                        `,
                        fragmentShaderSource: `
                            varying vec2 v_st;
                            varying float v_batchId;
                            uniform vec4 color;
                            uniform float dashLength;
                                    
                            void main() {
                                float d = fract(v_st.s * dashLength);
                                if (d < 0.5) {
                                    discard;
                                }
                                gl_FragColor = color;
                            }
                        `
                    })
                });
                cesium.scene.groundPrimitives.add(countyBorderPrimitive);
2

You have to be more precise here, else nobody might help you.

What exactly is “not working”? Does she shader compile? Do you get any errors? What is the expected result and what is rendered instead?

Screenshots might help. You can also put that into a sandcastle, so other people have it easier (and are thus more willing) to help you.

3

When you move the camera to the left mouse button, PolylineDash starts to shift. You can observe this in your default example in the sandcastle. I need to override the default shader so that the line is static