Cesium & Angular

Hi everyone !

I've followed this post:

Everything works well !

Except that i must use the 1.42.1 version of cesium.
If i use the latest 1.44 version, nothing shows up, and no error in console.

I only have to switch to 1.42.1 to make it work, with no other differences.

Can someone test it ?
To see if i'm not alone in this case ?

Thanks in advance.

Hi there,

The core Cesium team hasn’t used Angular ourselves. It may be worth contacting the author of that blog post, Aristeidis Bampakos, to see if he has any input on which version to use and if any updates are necessary. (The author is also pretty active on the forum, maybe he’ll catch this thread.)

Thanks,

Gabby

Hi,

There is a known bug with Cesium 1.44 and Angular example. You can follow the related issue in the official repo here https://github.com/Developer-Plexscape/cesium-angular-example/issues/1

In general it works. Angular 5 and Angular Material.

http://www.deepship.ai/#/globe

What I am trying to achieve might be difficult, this loads in the moment 22000 ships via a Perl Mysql czml and creates as many boxes and labels and clusters them…

The data is not updated yet as on the main page with leaflet.

So wait a bit for the whole page loading, the whole thing is alpha. But simpler efforts just loading a geojson with 27 point data + features. runs smoothly.

"cesium": "^1.44.0",
"angular-cesium": "0.0.48",
> Angular CLI: 1.7.4
> Node: 9.10.0
> OS: win32 x64
> Angular: 5.2.9
> ... animations, common, compiler, compiler-cli, core, forms
> ... http, language-service, platform-browser
> ... platform-browser-dynamic, router
>
> @angular/cli: 1.7.4
> @angular-devkit/build-optimizer: 0.3.2
> @angular-devkit/core: 0.3.2
> @angular-devkit/schematics: 0.3.2
> @ngtools/json-schema: 1.2.0
> @ngtools/webpack: 1.10.2
> @schematics/angular: 0.3.2
> @schematics/package-update: 0.3.2
> typescript: 2.5.3
> webpack: 3.11.0

Hi,
What do you think is the cause of the delay? Might be an Angular issue or a Cesium thing? I can see that you are using angular-cesium package which is really cool. Have you tried to load the CZML outside of angular-cesium package scope?

This is for the OP.
I compile with
ng build --aot --environment=prod --output-hashing=all
--sourcemaps=false --extract-css=true --named-chunks=false
--build-optimizer=true

because of an issue with FireFox
https://github.com/angular/angular-cli/issues/9340

@Aristeidis

File size. 38 MB Although the server the apache pulls the file from is gzipped.

The geojson is 7 MB

I haven't looked into 3D Tiles yet.
The CZML produces a lot of text as it also contains box, label and so
on definitions,
Ultimately I want to update live data so I have no idea yet what is
the quickest into Cesium and producing acceptable frame rates.

There is for me no need to run after this in the moment but here are
some errors thrown up.

It seems to be also that the Clustering algorithm is slower than in leaflet.

I have distanceDisplayCondition on for both labels and boxes and
checked that its working, Is this available for Clustering?
I use this code for Clustering.
https://github.com/AnalyticalGraphicsInc/cesium/blob/master/Apps/Sandcastle/gallery/Clustering.html
https://www.google.co.uk/search?ei=2XPXWu6cDemVgAaWpaRw&q=Clustering+distanceDisplayCondition&oq=Clustering+distanceDisplayCondition

There are on Chrome Windows 10 (Version 66.0.3359.117 (Official
Build) (64-bit)) as far as I can see.

[.Offscreen-For-WebGL-0000024BCE690310]GL ERROR :GL_INVALID_OPERATION
: glDrawElementsInstancedANGLE: attempt to access out of range
vertices in attribute 1

It stops at 256 errors.

generated. I think these are the labels.

On the latest Mozilla Firefox 59.0.2 (64-bit) Windows 10

Error: WebGL warning: texImage2D: Alpha-premult and y-flip are
deprecated for non-DOM-Element uploads.
scripts.bundle.js:476:31796
Error: WebGL warning: texImage2D: Alpha-premult and y-flip are
deprecated for non-DOM-Element uploads.
Error: WebGL warning: texSubImage2D: Alpha-premult and y-flip are
deprecated for non-DOM-Element uploads.
scripts.bundle.js:477:8149
Error: WebGL warning: drawElementsInstanced: Instance fetch requires
223275, but attribs only supply 157740.
scripts.bundle.js:504:12271
Error: WebGL warning: drawElementsInstanced: Instance fetch requires
223275, but attribs only supply 92205.
scripts.bundle.js:504:12271
Error: WebGL warning: drawElementsInstanced: Instance fetch requires
223275, but attribs only supply 26670.
scripts.bundle.js:504:12271
Error: WebGL warning: drawElementsInstanced: Instance fetch requires
223275, but attribs only supply 157740.
scripts.bundle.js:504:12271
Error: WebGL warning: drawElementsInstanced: Instance fetch requires
223275, but attribs only supply 92205.
scripts.bundle.js:504:12271
Error: WebGL warning: drawElementsInstanced: Instance fetch requires
223275, but attribs only supply 26670.
scripts.bundle.js:504:12271
Error: WebGL warning: drawElementsInstanced: Instance fetch requires
223275, but attribs only supply 157740.
scripts.bundle.js:504:12271
Error: WebGL warning: drawElementsInstanced: Instance fetch requires
223275, but attribs only supply 92205.
scripts.bundle.js:504:12271
Error: WebGL warning: drawElementsInstanced: Instance fetch requires
223275, but attribs only supply 26670.
scripts.bundle.js:504:12271
Error: WebGL warning: drawElementsInstanced: Instance fetch requires
223275, but attribs only supply 157740.
scripts.bundle.js:504:12271
Error: WebGL warning: drawElementsInstanced: Instance fetch requires
223275, but attribs only supply 92205.
scripts.bundle.js:504:12271
Error: WebGL warning: drawElementsInstanced: Instance fetch requires
223275, but attribs only supply 26670.

On edge nothing.

Hi there,

FYI, the bug has been resolved in Cesium 1.45.0 version.

I tried to upgrade and 1.45 fails in Angular 6 now with some other path issue. :frowning:

Hey all,

We have upgraded our example repository to work with Angular version 6. For those that do not want to upgrade yet, we maintain a separate branch for Angular version 5 in https://github.com/Developer-Plexscape/cesium-angular-example/tree/ng5

Thanks Aristeidis for all the work you’re doing! It’s a big help for the Cesium community using Angular.

Thanks,

Gabby

Hi everyone,

I’m new to this cesium and angular 8. I’m doing project using these two. I’m able to run angular application with cesium map viewing on that.

In order to draw rectangle on the globe, i have written code using sand castle of cesium. But im facing one problem

everytime I click a button the program it is creating new viewer and old viewer moving down in screen.

where can i get one small example of drawing line on globe which can be used as template.

Thanks every one in advance

sreeni

Hi sreeni,

Could you please share some code of the button that you mention so that we can help you identify what the problem is?

Thanks,

Aristeidis

Hi sreeni,

Would you like to return to the same viewer every time?

or you would like to rerender it again?

Ezri.