Cesium.js:467 [Cesium WebGL] Fragment shader compile log: ERROR: 0:? : '' : on return to page

CesiumJS
1

1. A concise explanation of the problem you’re experiencing.

Cesium.js:467 [Cesium WebGL] Fragment shader compile log: ERROR: 0:? : ‘’ : syntax error

x.showErrorPanel
@
Cesium.js:525
(anonymous)
@
Cesium.js:525
r.raiseEvent
@
Cesium.js:444
lt
@
Cesium.js:519
Ee.render
@
Cesium.js:519
x.render
@
Cesium.js:525
t
@
Cesium.js:525
push…/node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask
@
zone.js:421
onInvokeTask
@
core.js:3811
push…/node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask
@
zone.js:420
push…/node_modules/zone.js/dist/zone.js.Zone.runTask
@
zone.js:188
push…/node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask
@
zone.js:496
ZoneTask.invoke
@
zone.js:485
timer
@
zone.js:2054
requestAnimationFrame (async)
scheduleTask
@
zone.js:2075
push…/node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask
@
zone.js:407
onScheduleTask
@
zone.js:297
push…/node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask
@
zone.js:401
push…/node_modules/zone.js/dist/zone.js.Zone.scheduleTask
@
zone.js:232
push…/node_modules/zone.js/dist/zone.js.Zone.scheduleMacroTask
@
zone.js:255
scheduleMacroTaskWithCurrentZone
@
zone.js:1114
(anonymous)
@
zone.js:2090
proto.(anonymous function)
@
zone.js:1394
i
@
Cesium.js:462
t
@
Cesium.js:525
push…/node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask
@
zone.js:421
onInvokeTask
@
core.js:3811
push…/node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask
@
zone.js:420
push…/node_modules/zone.js/dist/zone.js.Zone.runTask
@
zone.js:188
push…/node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask
@
zone.js:496
ZoneTask.invoke
@
zone.js:485
timer
@
zone.js:2054
requestAnimationFrame (async)
scheduleTask
@
zone.js:2075
push…/node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask
@
zone.js:407
onScheduleTask
@
zone.js:297
push…/node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask
@
zone.js:401
push…/node_modules/zone.js/dist/zone.js.Zone.scheduleTask
@
zone.js:232
push…/node_modules/zone.js/dist/zone.js.Zone.scheduleMacroTask
@
zone.js:255
scheduleMacroTaskWithCurrentZone
@
zone.js:1114
(anonymous)
@
zone.js:2090
proto.(anonymous function)
@
zone.js:1394
i
@
Cesium.js:462
E
@
Cesium.js:525
set
@
Cesium.js:525
x
@
Cesium.js:525
te
@
Cesium.js:528
push…/src/app/globe/globe.component.ts.GlobeComponent.ngAfterViewInit
@
globe.component.ts:426
callProviderLifecycles
@
core.js:9560
callElementProvidersLifecycles
@
core.js:9534
callLifecycleHooksChildrenFirst
@
core.js:9524
checkAndUpdateView
@
core.js:10460
callViewAction
@
core.js:10692
execEmbeddedViewsAction
@
core.js:10655
checkAndUpdateView
@
core.js:10452
callViewAction
@
core.js:10692
execComponentViewsAction
@
core.js:10634
checkAndUpdateView
@
core.js:10457
callWithDebugContext
@
core.js:11344
debugCheckAndUpdateView
@
core.js:11022
push…/node_modules/@angular/core/fesm5/core.js.ViewRef_.detectChanges
@
core.js:8838
(anonymous)
@
core.js:4571
push…/node_modules/@angular/core/fesm5/core.js.ApplicationRef.tick
@
core.js:4571
(anonymous)
@
core.js:4462
push…/node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke
@
zone.js:388
onInvoke
@
core.js:3820
push…/node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke
@
zone.js:387
push…/node_modules/zone.js/dist/zone.js.Zone.run
@
zone.js:138
push…/node_modules/@angular/core/fesm5/core.js.NgZone.run
@
core.js:3734
next
@
core.js:4462
schedulerFn
@
core.js:3551
push…/node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.__tryOrUnsub
@
Subscriber.js:196
push…/node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.next
@
Subscriber.js:134
push…/node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber._next
@
Subscriber.js:77
push…/node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.next
@
Subscriber.js:54
push…/node_modules/rxjs/_esm5/internal/Subject.js.Subject.next
@
Subject.js:47
push…/node_modules/@angular/core/fesm5/core.js.EventEmitter.emit
@
core.js:3535
checkStable
@
core.js:3789
onHasTask
@
core.js:3833
push…/node_modules/zone.js/dist/zone.js.ZoneDelegate.hasTask
@
zone.js:441
push…/node_modules/zone.js/dist/zone.js.ZoneDelegate._updateTaskCount
@
zone.js:461
push…/node_modules/zone.js/dist/zone.js.Zone._updateTaskCount
@
zone.js:285
push…/node_modules/zone.js/dist/zone.js.Zone.runTask
@
zone.js:205
drainMicroTaskQueue
@
zone.js:595
push…/node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask
@
zone.js:500
invokeTask
@
zone.js:1540
globalZoneAwareCallback
@
zone.js:1566

​

Happens not on first page load, but if I go to other page of my site and go back all glbs and gltfs seem to fail

2. A minimal code example. If you’ve found a bug, this helps us reproduce and repair it.

this.viewer.scene.primitives.add(Cesium.Model.fromGltf({

url: ‘/assets/models/myship.gltf’,

modelMatrix: modelMatrix,

heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,

scale: 1.0

}));

All glb and gltf fail

I comment this from my code and it works again.

4. The Cesium version you’re using, your operating system and browser.

Started with 1.5, just loaded 1.51 same problem

As far as I remember I did not have this problem before with the same glbs and gltfs Cesium 1.4x

{

“name”: “xxx”,

“version”: “0.0.0”,

“license”: “xxx”,

“scripts”: {

“ng”: “ng”,

“start”: “ng serve”,

“build”: “ng build --prod”,

“test”: “ng test”,

“lint”: “ng lint”,

“e2e”: “ng e2e”

},

“private”: true,

“dependencies”: {

“@angular/animations”: “^6.1.10”,

“@angular/cdk”: “^6.4.7”,

“@angular/common”: “^6.1.10”,

“@angular/compiler”: “^6.1.10”,

“@angular/core”: “^6.1.10”,

“@angular/flex-layout”: “^6.0.0-beta.18”,

“@angular/forms”: “^6.1.10”,

“@angular/http”: “^6.1.10”,

“@angular/material”: “^6.4.7”,

“@angular/platform-browser”: “^6.1.10”,

“@angular/platform-browser-dynamic”: “^6.1.10”,

“@angular/router”: “^6.1.10”,

“@asymmetrik/ngx-leaflet”: “^4.0.0”,

“@asymmetrik/ngx-leaflet-markercluster”: “^1.0.0”,

“@mapbox/point-geometry”: “^0.1.0”,

“@mapbox/vector-tile”: “^1.3.1”,

“@types/eventsource”: “^1.0.2”,

“@types/geojson”: “^7946.0.4”,

“@types/leaflet.markercluster”: “^1.0.3”,

“angular-cesium”: “0.0.53”,

“angular-svg-icon”: “^6.0.0”,

“angular2parse”: “^1.0.8”,

“bootstrap”: “^4.1.3”,

“cesium”: “^1.51.0”,

“core-js”: “^2.5.7”,

“core.js”: “^0.4.2”,

“d3”: “^5.7.0”,

“event-source”: “^0.1.1”,

“event-source-polyfill”: “0.0.16”,

“eventsource”: “^1.0.7”,

“hammerjs”: “^2.0.8”,

“http”: “0.0.0”,

“https”: “^1.0.0”,

“jquery”: “^3.3.1”,

“leaflet”: “git+https://github.com/Leaflet/Leaflet.git#v1.0.3”,

“leaflet-list-markers”: “git+https://github.com/stefanocudini/leaflet-list-markers.git”,

“leaflet-rotatedmarker”: “^0.2.0”,

“leaflet.markercluster”: “^1.4.1”,

“leaflet.timeline”: “git+https://github.com/skeate/Leaflet.timeline.git”,

“leaflet.vectorgrid”: “^1.3.0”,

“material-design-icons”: “^3.0.1”,

“npm”: “^6.4.1”,

“popper”: “^1.0.1”,

“rxjs”: “^6.3.3”,

“rxjs-compat”: “^6.1.0”,

“svg-country-flags”: “^1.2.6”,

“ts-lint”: “^4.5.1”,

“tslib”: “^1.9.3”,

“zone.js”: “^0.8.26”

},

“devDependencies”: {

“@angular-devkit/build-angular”: “^0.8.5”,

“@angular/cli”: “^6.2.5”,

“@angular/compiler-cli”: “^6.1.10”,

“@angular/language-service”: “^6.1.10”,

“@types/jasmine”: “^2.8.9”,

“@types/jasminewd2”: “^2.0.5”,

“@types/leaflet”: “^1.2.11”,

“@types/node”: “^10.12.0”,

“codelyzer”: “^4.5.0”,

“jasmine-core”: “^3.2.1”,

“jasmine-spec-reporter”: “~4.2.1”,

“karma”: “^3.0.0”,

“karma-chrome-launcher”: “~2.2.0”,

“karma-coverage-istanbul-reporter”: “^2.0.4”,

“karma-jasmine”: “^1.1.2”,

“karma-jasmine-html-reporter”: “^1.3.1”,

“protractor”: “^5.4.1”,

“ts-node”: “^7.0.1”,

“tslint”: “^5.11.0”,

“typescript”: “^2.9.2”

}

}

myship.gltf (27.5 KB)

2

Installed Cesium 1.47 1.48 1.49 and the error doesn’t appear.

Maybe one of these additions to 1.5

3

I did my models with /COLLADA2GLTF-bin no extra options like

-m, --materialsCommon output materials using the KHR_materials_common extension [bool] [default: false]

–metallicRoughnessTextures paths to images to use as the PBR metallicRoughness textures [vec]

just -b for binary and gltfs

4

I’m having a hard time recreating this. When you say:

Happens not on first page load, but if I go to other page of my site and go back all glbs and gltfs seem to fail

Do you mean when you go to a different tab or simply to a different page and back? How consistently can you recreate it? Does it happen when you refresh? Does it happen on all the browsers you’ve tested?

It might also help to use the unminified version of Cesium to get more descriptive errors. Since this is a shader error, it might help to print out the frag shader source right before it throws an error. So if you put a print statement here:

https://github.com/AnalyticalGraphicsInc/cesium/blob/master/Source/Renderer/ShaderProgram.js#L219

to print fsSource and then post that here it might help narrow this down.

5

Sorry was busy with other stuff.

You load the Cesium page. Go to another page then go back to the Cesium page.

Because of other shader issues before 1.5 I compile with
λ ng build --aot --configuration=production --output-hashing=all
--source-map=true --extract-css=true --named-chunks=false
--build-optimizer=true --optimization=false

When I have time I will do the fsource inclusion.

Happens in all browsers.

6

Does it happen if you refresh the page?

7

No

8

The same page in my angular web page, no other websites no other tabs,
just within the same web page.

This has now Cesium 1.49 so it will not happen just to demonstrate

Load

http://www.deepship.ai/#/globe
click on Home
http://www.deepship.ai/#/home
Click on Globe
http://www.deepship.ai/#/globe

9

I see what you mean now. Do you know what all happens on click of each button? Are you destroying and recreating the viewer? Maybe you can try caching the viewer and re-using it to see if that’s the problem?