Navigation Controls in CesiumJS 1.146

HELP, PLEASE!

Using CesiumJS 1.146 and trying to insert a lollipop navigation control (zoom, pan, compass, etc.). Have looked at all Mixins and implemented them but all seem to fail. This is my code

[In HEAD section, using Acevedo Mixin from GitHub]

Appropriate opening and closing “Script” tags around the following two lines. Cannot seem to get them into a forum post:

src=“..1.146/Build/Cesium/Cesium.js”

src=“'…/cesiumNavigationControlMixin.min.js”

[In JS Code]

viewer = new Cesium.Viewer(“cesiumContainer”, {});

viewer.extend(Cesium.viewerCesiumNavigationMixin, {});

The Cesium viewer is instantiated but extending it fails with error in the Mixin: “Uncaught TypeError: defineProperties is not a function”

Is there a way to implement a lollipop navigation control in CesiumJS 1.146? Can someone plesae provide the code to do this?

Thank you,

Clyde Ford

If I am not mistaken, this navigation control is not working with the latest versions of Cesium. Last time I checked it, it seems to have been abandoned as a project.

Thanks, you are right. It is not working with the latest versions of Cesium. So I tried the lastest version of a navigation control I could find. This ES6 version of the navigation controls at cesium-navigation-es6 CDN by jsDelivr - A CDN for npm and GitHub .

Results:

Lollipop navigation control renders on Cesium map BUT clicking anywhere on the control generates the same error:

Uncaught TypeError: Cannot read properties of undefined (reading ‘pick’)

Find it hard to believe I’m the only one whose run up against this issue. Anyone in the community found a way to get this control to work?

Thanks,

Clyde Ford

The original ‘cesium-navigation’ project is obviously abandoned.

Looking at the forks, there seems to be one fork with recent activity.

This is NOT a recommendation or endorsement of that fork or the library in general!

Just something that you might want to have a look at:

The fork says that it “Requires Cesium >= 1.100”. This does not mean that it will work with the current CesiumJS version. But it might be easier to update or get it running…

Marco13

Thank you, so much. I had not checked the forks and this does seem like a good place to start trying to get this control to work.

Clyde Ford

For anyone who needs a compass/navigational control that works with 1.146 OMG, what a process to get that navigation control up and running:

  1. Ended up using the compass control from CesiumJS Helpers on GitHub here.
  2. This is a node.js project, so built it with npm
  3. But I’m using Cesium from within the Joomla CMS, so could not use node.js
  4. Used esbuild to transform the node_module dependencies into a bundled JS file
  5. Stuck bundled JS file inside “script” tags as usual
  6. Now could execute code to display compass on my viewer
  7. Will roll my own Zoom and Reset controls as they are fairly easy to do

Most important thing was using esbuild on the demo JS file for the compass to get the bundled JS.

Clyde