Cesium Navigation Plugin

794 views
Skip to first unread message

Shubham Choudhary

unread,
Apr 18, 2018, 5:41:16 AM4/18/18
to cesium-dev
Hello all,
I need compass to be added to my Cesium Project,

For that I have tried this solution https://github.com/alberto-acevedo/cesium-navigation, still I am not able to use it in my project.



<!DOCTYPE html>
<html lang="en">
<head>
  <!-- Use correct character set. -->
  <meta charset="utf-8">
  <!-- Tell IE to use the latest, best version. -->
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <!-- Make the application on mobile take up the full browser screen and disable user scaling. -->
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
  <title>Compass Cesium POC</title>
  <script src="../Build/Cesium/Cesium.js"></script>
  <script src="../node_modules/requirejs/require.js"></script>
  <!-- IMPORTANT: because the cesium navigation viewer mixin depends on Cesium be sure to load it after Cesium -->
  <script src="../Source/viewerCesiumNavigationMixin.js"></script>
  <script src="../Source/SpirographPositionProperty.js"></script>

  <style>
      @import url(../Build/Cesium/Widgets/widgets.css);
      html, body, #cesiumContainer {
          width: 100%; height: 100%; margin: 0; padding: 0; overflow: hidden;
      }
  </style>
</head>
<body>
  <div id="cesiumContainer"></div>

<script>
var viewer = new Cesium.Viewer('cesiumContainer');

// extend our view by the cesium navigaton mixin
viewer.extend(Cesium.viewerCesiumNavigationMixin, {});
var cesiumNavigation = viewer.cesiumNavigation;
var options = {};
options.defaultResetView = Cesium.Rectangle.fromDegrees(71, 3, 90, 14);
// Only the compass will show on the map
alert("test");
options.enableCompass = true;
alert("compass");
options.enableZoomControls = false;
options.enableDistanceLegend = false;
viewer.extend(Cesium.viewerCesiumNavigationMixin, options);

  </script>
</body>
</html>

This code generates two errors:
        1). Uncaught Error: Mismatched anonymous define() module: function (
                  defined,
                  defineProperties,
                  DeveloperError,
                  CesiumNavigation) {
                  'use strict';
                  - - - - - - - - - 
                 }
                 at makeError (require.js:168)
                 at intakeDefines (require.js:1254)
                 at require.js:1452
 
         2). Uncaught TypeError: e is not a function
              at $.extend (Cesium.js:535)
              at testnav.html:31
                   

I just want to include the compass to my cesium project.
please provide me in detail information how to achieve it.


Cesium Version: 1.44 ,
Browser : Google Chrome , 
Browser Version :  65.0.3325.181 (Official Build) (64-bit) ,
Operating System : Windows 10



Gabby Getz

unread,
Apr 20, 2018, 10:44:04 AM4/20/18
to cesium-dev
Hi there,

We don't support the cesium-navigation project ourselves. However, the project appears not not have been updated in 2 years, which means it's not up to date with the latest releases of Cesium. Contact the maintainer of the project, maybe they can update or tell you a compatible version of Cesium.

Thanks.
Gabby
Reply all
Reply to author
Forward
0 new messages