Merge pull request #5124 from zoran995/custom-terrain

Restore `cesiumTerrainUrl` parameter
TerriaJS · Feb 8, 2021 · e1e6985 · e1e6985
2 parents 4a11bdc + 5f21c61
commit e1e6985
Show file tree

Hide file tree

Showing 6 changed files with 64 additions and 28 deletions.
diff --git a/CHANGES.md b/CHANGES.md
@@ -4,6 +4,8 @@ Change Log
 ### MobX Development
 
 #### next release (8.0.0-alpha.66)
+* Restore `cesiumTerrainUrl` config parameter. [#5124](https://github.com/TerriaJS/terriajs/pull/5124)
+* I18n-ify strings in settings panel. [#5124](https://github.com/TerriaJS/terriajs/pull/5124)
 * Moved `DataCustodianTraits` into `CatalogMemberTraits` and `CatalogMemberReferenceTraits`.
 * `TableMixin` styles ("Display variables") will now look for column title if style title is undefined
 * Add fallback colours when Color.fromCssColorString is used.

diff --git a/doc/customizing/client-side-config.md b/doc/customizing/client-side-config.md
@@ -55,6 +55,7 @@ Specifies various options for configuring TerriaJS:
 |`interceptBrowserPrint`|no|**boolean**|`true`|True (the default) to intercept the browser's print feature and use a custom one accessible through the Share panel.|
 |`tabbedCatalog`|no|**boolean**|`false`|True to create a separate explorer panel tab for each top-level catalog group to list its items in.|
 |`useCesiumIonTerrain`|no|**boolean**|`true`|True to use Cesium World Terrain from Cesium ion. False to use terrain from the URL specified with the `"cesiumTerrainUrl"` property. If this property is false and `"cesiumTerrainUrl"` is not specified, the 3D view will use a smooth ellipsoid instead of a terrain surface. Defaults to true.|
+|`cesiumTerrainUrl`|no|**string**|undefined|The URL to use for Cesium terrain in the 3D Terrain viewer, in quantized mesh format. This property is ignored if "useCesiumIonTerrain" is set to true.|
 |`cesiumIonAccessToken`|no|**string**|undefined|The access token to use with Cesium ion. If `"useCesiumIonTerrain"` is true and this property is not specified, the Cesium default Ion key will be used. It is a violation of the Ion terms of use to use the default key in a deployed application.|
 |`useCesiumIonBingImagery`|no|**boolean**|`true`|True to use Bing Maps from Cesium ion (Cesium World Imagery). By default, Ion will be used, unless the `bingMapsKey` property is specified, in which case that will be used instead. To disable the Bing Maps layers entirely, set this property to false and set `bingMapsKey` to null.|
 |`bingMapsKey`|no|**string**|undefined|A [Bing Maps API key](https://msdn.microsoft.com/en-us/library/ff428642.aspx) used for requesting Bing Maps base maps and using the Bing Maps geocoder for searching. It is your responsibility to request a key and comply with all terms and conditions.|

diff --git a/lib/Language/en/translation.json b/lib/Language/en/translation.json
@@ -247,7 +247,21 @@
     "nativeResolutionHeader": "Use native device resolution",
     "mapQuality": "Raster Map Quality:",
     "qualityLabel": "Quality",
-    "performanceLabel": "Performance"
+    "performanceLabel": "Performance",
+    "timeline": {
+      "alwaysShowLabel": "Press to start only showing the timeline when there are time-varying datasets on the workbench",
+      "hideLabel": "Press to start always showing the timeline, even when no time-varying datasets are on the workbench",
+      "alwaysShow": "Always show"
+    },
+    "terrain": {
+      "hideUnderground": "Terrain hides underground features",
+      "showUndergroundFeatures": "Press to start showing features that are underneath the terrain surface",
+      "hideUndergroundFeatures": "Press to start hiding features that are underneath the terrain surface",
+      "sideLabel": "Show Terrain on the",
+      "left": "Left",
+      "both": "Both",
+      "right": "Right"
+    }
   },
   "feedback": {
     "feedbackPreamble": "We would love to hear from you!",

diff --git a/lib/Models/Cesium.ts b/lib/Models/Cesium.ts
@@ -1,9 +1,11 @@
+import i18next from "i18next";
 import { autorun, computed, runInAction } from "mobx";
 import { createTransformer } from "mobx-utils";
 import BoundingSphere from "terriajs-cesium/Source/Core/BoundingSphere";
 import Cartesian2 from "terriajs-cesium/Source/Core/Cartesian2";
 import Cartesian3 from "terriajs-cesium/Source/Core/Cartesian3";
 import Cartographic from "terriajs-cesium/Source/Core/Cartographic";
+import CesiumTerrainProvider from "terriajs-cesium/Source/Core/CesiumTerrainProvider";
 import Clock from "terriajs-cesium/Source/Core/Clock";
 import createWorldTerrain from "terriajs-cesium/Source/Core/createWorldTerrain";
 import Credit from "terriajs-cesium/Source/Core/Credit";
@@ -16,12 +18,14 @@ import EventHelper from "terriajs-cesium/Source/Core/EventHelper";
 import FeatureDetection from "terriajs-cesium/Source/Core/FeatureDetection";
 import HeadingPitchRange from "terriajs-cesium/Source/Core/HeadingPitchRange";
 import Ion from "terriajs-cesium/Source/Core/Ion";
+import KeyboardEventModifier from "terriajs-cesium/Source/Core/KeyboardEventModifier";
 import CesiumMath from "terriajs-cesium/Source/Core/Math";
 import Matrix4 from "terriajs-cesium/Source/Core/Matrix4";
 import PerspectiveFrustum from "terriajs-cesium/Source/Core/PerspectiveFrustum";
 import Rectangle from "terriajs-cesium/Source/Core/Rectangle";
 import sampleTerrain from "terriajs-cesium/Source/Core/sampleTerrain";
 import ScreenSpaceEventType from "terriajs-cesium/Source/Core/ScreenSpaceEventType";
+import TerrainProvider from "terriajs-cesium/Source/Core/TerrainProvider";
 import Transforms from "terriajs-cesium/Source/Core/Transforms";
 import BoundingSphereState from "terriajs-cesium/Source/DataSources/BoundingSphereState";
 import DataSource from "terriajs-cesium/Source/DataSources/DataSource";
@@ -37,11 +41,16 @@ import SceneTransforms from "terriajs-cesium/Source/Scene/SceneTransforms";
 import SingleTileImageryProvider from "terriajs-cesium/Source/Scene/SingleTileImageryProvider";
 import when from "terriajs-cesium/Source/ThirdParty/when";
 import CesiumWidget from "terriajs-cesium/Source/Widgets/CesiumWidget/CesiumWidget";
+import getElement from "terriajs-cesium/Source/Widgets/getElement";
+import filterOutUndefined from "../Core/filterOutUndefined";
 import isDefined from "../Core/isDefined";
+import LatLonHeight from "../Core/LatLonHeight";
 import pollToPromise from "../Core/pollToPromise";
 import CesiumRenderLoopPauser from "../Map/CesiumRenderLoopPauser";
 import CesiumSelectionIndicator from "../Map/CesiumSelectionIndicator";
+import MapboxVectorTileImageryProvider from "../Map/MapboxVectorTileImageryProvider";
 import PickedFeatures, { ProviderCoordsMap } from "../Map/PickedFeatures";
+import TileErrorHandlerMixin from "../ModelMixins/TileErrorHandlerMixin";
 import SplitterTraits from "../Traits/SplitterTraits";
 import TerriaViewer from "../ViewModels/TerriaViewer";
 import CameraView from "./CameraView";
@@ -56,15 +65,7 @@ import Mappable, {
   MapItem
 } from "./Mappable";
 import Terria from "./Terria";
-import MapboxVectorTileImageryProvider from "../Map/MapboxVectorTileImageryProvider";
-import getElement from "terriajs-cesium/Source/Widgets/getElement";
-import LatLonHeight from "../Core/LatLonHeight";
-import filterOutUndefined from "../Core/filterOutUndefined";
-import KeyboardEventModifier from "terriajs-cesium/Source/Core/KeyboardEventModifier";
 import UserDrawing from "./UserDrawing";
-import i18next from "i18next";
-import TerrainProvider from "terriajs-cesium/Source/Core/TerrainProvider";
-import TileErrorHandlerMixin from "../ModelMixins/TileErrorHandlerMixin";
 
 //import Cesium3DTilesInspector from "terriajs-cesium/Source/Widgets/Cesium3DTilesInspector/Cesium3DTilesInspector";
 
@@ -909,8 +910,15 @@ export default class Cesium extends GlobeOrMap {
     if (!this.terriaViewer.viewerOptions.useTerrain) {
       return { terrain: new EllipsoidTerrainProvider() };
     }
+    if (this.terria.configParameters.cesiumTerrainUrl) {
+      return {
+        terrain: new CesiumTerrainProvider({
+          url: this.terria.configParameters.cesiumTerrainUrl
+        })
+      };
+    }
     // Check if there's a TerrainProvider in map items and use that if there is
-    if (this._firstMapItemTerrainProviders) {
+    else if (this._firstMapItemTerrainProviders) {
       return { terrain: this._firstMapItemTerrainProviders };
     } else if (this.terria.configParameters.useCesiumIonTerrain) {
       const logo = require("terriajs-cesium/Source/Assets/Images/ion-credit.png");

diff --git a/lib/Models/Terria.ts b/lib/Models/Terria.ts
@@ -141,6 +141,10 @@ interface ConfigParameters {
    * True to use Cesium World Terrain from Cesium ion. False to use terrain from the URL specified with the `"cesiumTerrainUrl"` property. If this property is false and `"cesiumTerrainUrl"` is not specified, the 3D view will use a smooth ellipsoid instead of a terrain surface. Defaults to true.
    */
   useCesiumIonTerrain?: boolean;
+  /**
+   * The URL to use for Cesium terrain in the 3D Terrain viewer, in quantized mesh format. This property is ignored if "useCesiumIonTerrain" is set to true.
+   */
+  cesiumTerrainUrl?: string;
   /**
    * The access token to use with Cesium ion. If `"useCesiumIonTerrain"` is true and this property is not specified, the Cesium default Ion key will be used. It is a violation of the Ion terms of use to use the default key in a deployed application.
    */
@@ -312,6 +316,7 @@ export default class Terria {
     interceptBrowserPrint: true,
     tabbedCatalog: false,
     useCesiumIonTerrain: true,
+    cesiumTerrainUrl: undefined,
     cesiumIonAccessToken: undefined,
     useCesiumIonBingImagery: undefined,
     bingMapsKey: undefined,

diff --git a/lib/ReactViews/Map/Panels/SettingPanel.jsx b/lib/ReactViews/Map/Panels/SettingPanel.jsx
@@ -28,6 +28,13 @@ import Styles from "./setting-panel.scss";
  *
  * @extends {React.Component<Props>}
  */
+
+const sides = {
+  left: "settingPanel.terrain.left",
+  both: "settingPanel.terrain.both",
+  right: "settingPanel.terrain.right"
+};
+
 @observer
 class SettingPanel extends React.Component {
   static propTypes = {
@@ -107,15 +114,15 @@ class SettingPanel extends React.Component {
     event.stopPropagation();
 
     switch (side) {
-      case "Left":
+      case sides.left:
         this.props.terria.terrainSplitDirection = ImagerySplitDirection.LEFT;
         this.props.terria.showSplitter = true;
         break;
-      case "Right":
+      case sides.right:
         this.props.terria.terrainSplitDirection = ImagerySplitDirection.RIGHT;
         this.props.terria.showSplitter = true;
         break;
-      case "Both":
+      case sides.both:
         this.props.terria.terrainSplitDirection = ImagerySplitDirection.NONE;
         break;
     }
@@ -181,9 +188,9 @@ class SettingPanel extends React.Component {
       supportsDepthTestAgainstTerrain &&
       this.props.terria.depthTestAgainstTerrainEnabled;
 
-    const depthTestAgainstTerrainLabel = `Press to start ${
-      depthTestAgainstTerrainEnabled ? "showing" : "hiding"
-    } features that are underneath the terrain surface`;
+    const depthTestAgainstTerrainLabel = depthTestAgainstTerrainEnabled
+      ? t("settingPanel.terrain.showUndergroundFeatures")
+      : t("settingPanel.terrain.hideUndergroundFeatures");
 
     const viewerModes = [];
 
@@ -197,16 +204,15 @@ class SettingPanel extends React.Component {
     viewerModes.push("3dsmooth", "2d");
 
     const supportsSide = isCesiumWithTerrain;
-    const sides = ["Left", "Both", "Right"];
 
-    let currentSide = "Both";
+    let currentSide = sides.both;
     if (supportsSide) {
       switch (this.props.terria.terrainSplitDirection) {
         case ImagerySplitDirection.LEFT:
-          currentSide = "Left";
+          currentSide = sides.left;
           break;
         case ImagerySplitDirection.RIGHT:
-          currentSide = "Right";
+          currentSide = sides.right;
           break;
       }
     }
@@ -219,8 +225,8 @@ class SettingPanel extends React.Component {
       timelineStack.defaultTimeVarying.currentTimeAsJulianDate !== undefined;
 
     const alwaysShowTimelineLabel = alwaysShowTimeline
-      ? "Press to start only showing the timeline when there are time-varying datasets on the workbench"
-      : "Press to start always showing the timeline, even when no time-varying datasets are on the workbench";
+      ? t("settingPanel.timeline.alwaysShowLabel")
+      : t("settingPanel.timeline.hideLabel");
 
     return (
       <MenuPanel
@@ -254,21 +260,21 @@ class SettingPanel extends React.Component {
         <If condition={supportsSide}>
           <div className={classNames(Styles.viewer, DropdownStyles.section)}>
             <label className={DropdownStyles.heading}>
-              Show Terrain on the
+              {t("settingPanel.terrain.sideLabel")}
             </label>
             <ul className={Styles.viewerSelector}>
-              <For each="side" of={sides}>
+              {Object.values(sides).map(side => (
                 <li key={side} className={Styles.listItemThreeCols}>
                   <button
                     onClick={this.showTerrainOnSide.bind(this, side)}
                     className={classNames(Styles.btnViewer, {
                       [Styles.isActive]: side === currentSide
                     })}
                   >
-                    {side}
+                    {t(side)}
                   </button>
                 </li>
-              </For>
+              ))}
             </ul>
           </div>
         </If>
@@ -299,7 +305,7 @@ class SettingPanel extends React.Component {
                   Styles.nativeResolutionHeader
                 )}
               >
-                Terrain hides underground features
+                {t("settingPanel.terrain.hideUnderground")}
               </label>
             </section>
           </div>
@@ -369,7 +375,7 @@ class SettingPanel extends React.Component {
                 Styles.nativeResolutionHeader
               )}
             >
-              Always show
+              {t("settingPanel.timeline.alwaysShow")}
             </label>
           </section>
         </div>