Merge pull request #1031 from TerriaJS/no_geojson_underscores

Remove underscores from geojson feature info key names
TerriaJS · Nov 5, 2015 · fd8e425 · fd8e425
2 parents 33af227 + eba3a40
commit fd8e425
Show file tree

Hide file tree

Showing 2 changed files with 42 additions and 10 deletions.
diff --git a/CHANGES.md b/CHANGES.md
@@ -5,6 +5,7 @@ Change Log
 ### 1.0.47
 
 * The `name` of a feature from a CSV file is now taken from a `name` or `title` column, if it exists.  Previously the name was always "Site Data".
+* Underscores are now replaced with spaces in the feature info panel for `GeoJsonCatalogItem`.
 * Updated to [Cesium](http://cesiumjs.org) 1.15.  Significant changes relevant to TerriaJS users include:
   * Added support for the [glTF 1.0](https://github.com/KhronosGroup/glTF/blob/master/specification/README.md) draft specification.
   * Added support for the glTF extensions [KHR_binary_glTF](https://github.com/KhronosGroup/glTF/tree/master/extensions/Khronos/KHR_binary_glTF) and [KHR_materials_common](https://github.com/KhronosGroup/glTF/tree/KHR_materials_common/extensions/Khronos/KHR_materials_common).

diff --git a/lib/Models/GeoJsonCatalogItem.js b/lib/Models/GeoJsonCatalogItem.js
@@ -6,6 +6,7 @@ var proj4 = require('proj4');
 var CesiumMath = require('terriajs-cesium/Source/Core/Math');
 var Color = require('terriajs-cesium/Source/Core/Color');
 var defined = require('terriajs-cesium/Source/Core/defined');
+var definedNotNull = require('terriajs-cesium/Source/Core/definedNotNull');
 var defineProperties = require('terriajs-cesium/Source/Core/defineProperties');
 var DeveloperError = require('terriajs-cesium/Source/Core/DeveloperError');
 var GeoJsonDataSource = require('terriajs-cesium/Source/DataSources/GeoJsonDataSource');
@@ -154,6 +155,35 @@ GeoJsonCatalogItem.prototype._getValuesThatInfluenceLoad = function() {
 var zipFileRegex = /.zip\b/i;
 var geoJsonRegex = /.geojson\b/i;
 
+var simpleStyleIdentifiers = ['title', 'description', //
+'marker-size', 'marker-symbol', 'marker-color', 'stroke', //
+'stroke-opacity', 'stroke-width', 'fill', 'fill-opacity'];
+
+// this next function modelled on Cesium.geoJsonDataSource's defaultDescribe
+function describeWithoutUnderscores(properties, nameProperty) {
+    var html = '';
+    for ( var key in properties) {
+        if (properties.hasOwnProperty(key)) {
+            if (key === nameProperty || simpleStyleIdentifiers.indexOf(key) !== -1) {
+                continue;
+            }
+            var value = properties[key];
+            key = key.replace(/_/g, ' ');
+            if (definedNotNull(value)) {
+                if (typeof value === 'object') {
+                    html += '<tr><th>' + key + '</th><td>' + describeWithoutUnderscores(value) + '</td></tr>';
+                } else {
+                    html += '<tr><th>' + key + '</th><td>' + value + '</td></tr>';
+                }
+            }
+        }
+    }
+    if (html.length > 0) {
+        html = '<table class="cesium-infoBox-defaultTable"><tbody>' + html + '</tbody></table>';
+    }
+    return html;
+}
+
 GeoJsonCatalogItem.prototype._load = function() {
     this._dataSource = new GeoJsonDataSource(this.name);
 
@@ -366,7 +396,7 @@ function loadGeoJson(geoJsonItem) {
     /* Style information is applied as follows, in decreasing priority:
     - simple-style properties set directly on individual features in the GeoJSON file
     - simple-style properties set as the 'Style' property on the catalog item
-    - our 'defaultStyles' set below (and point styling applied after Cesium loads the GeoJSON)
+    - our 'options' set below (and point styling applied after Cesium loads the GeoJSON)
     - if anything is underspecified there, then Cesium's defaults come in.
 
     See https://github.com/mapbox/simplestyle-spec/tree/master/1.1.0
@@ -408,7 +438,8 @@ function loadGeoJson(geoJsonItem) {
 
     var style = defaultValue(geoJsonItem.style, {});
 
-    var defaultStyles = {
+    var options = {
+        describe: describeWithoutUnderscores,
         markerSize : defaultValue(parseMarkerSize(style['marker-size']), 20),
         markerSymbol: style['marker-symbol'], // and undefined if none
         markerColor : defaultColor(style['marker-color'], pointPalette),
@@ -417,17 +448,17 @@ function loadGeoJson(geoJsonItem) {
         markerOpacity: style['marker-opacity'] // not in SimpleStyle spec or supported by Cesium but see below
     };
 
-    defaultStyles.fill = defaultColor(style.fill, defaultStyles.stroke.clone);
+    options.fill = defaultColor(style.fill, options.stroke.clone);
     if (defined(style['stroke-opacity'])) {
-        defaultStyles.stroke.alpha = Number.parseFloat(style['stroke-opacity']);
+        options.stroke.alpha = Number.parseFloat(style['stroke-opacity']);
     }
     if (defined(style['fill-opacity'])) {
-        defaultStyles.fill.alpha = Number.parseFloat(style['fill-opacity']);
+        options.fill.alpha = Number.parseFloat(style['fill-opacity']);
     } else {
-        defaultStyles.fill.alpha = 0.75;
+        options.fill.alpha = 0.75;
     }
 
-    return dataSource.load(geoJsonItem._readyData, defaultStyles).then(function() {
+    return dataSource.load(geoJsonItem._readyData, options).then(function() {
         var entities = dataSource.entities.values;
 
         for (var i = 0; i < entities.length; ++i) {
@@ -437,10 +468,10 @@ function loadGeoJson(geoJsonItem) {
                a filled circle instead of the default marker. */
             if (defined(entity.billboard) &&
                 !defined(entity.properties['marker-symbol']) &&
-                !defined(defaultStyles.markerSymbol)) {
+                !defined(options.markerSymbol)) {
                 entity.point = new PointGraphics({
-                    color: defaultStyles.markerColor,
-                    pixelSize: defaultStyles.markerSize / 2,
+                    color: options.markerColor,
+                    pixelSize: options.markerSize / 2,
                     outlineWidth: 1,
                     outlineColor: Color.BLACK
                 });