Add message if no elevation data is available (#373)

css/style.css

@@ -770,3 +770,16 @@ table.dataTable.display tbody tr:hover.selected {
     content: '\f06a'; /* fa-exclamation */
     margin-left: 3px;
 }
+
+#elevation-chart {
+    position: relative;
+}
+
+#no-elevation-data {
+    z-index: 1000;
+    margin: 0;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+}

index.html

@@ -1036,7 +1036,11 @@
             </div>
         </div>
 
-        <div class="collapse" id="elevation-chart"></div>
+        <div class="collapse" id="elevation-chart">
+            <span id="no-elevation-data" data-i18n="footer.no-elevation-data" style="display: none"
+                >No elevation data available for this route.</span
+            >
+        </div>
 
         <footer class="flexrow">
             <div id="stats-info" class="flexgrow">

js/plugin/Heightgraph.js

@@ -157,6 +157,16 @@ BR.Heightgraph = function (map, layersControl, routing, pois) {
             }
 
             if (track && track.getLatLngs().length > 0) {
+                // there is no elevation data available above 60°N, except within 10°E-30°E (issue #365)
+                if (
+                    track.getLatLngs().filter(function (point) {
+                        return point.alt !== undefined;
+                    }).length == 0
+                ) {
+                    $('#no-elevation-data').show();
+                } else {
+                    $('#no-elevation-data').hide();
+                }
                 var geojsonFeatures = geoDataExchange.buildGeojsonFeatures(track.getLatLngs());
                 this.addData(geojsonFeatures);
 

locales/en.json

@@ -55,6 +55,7 @@
     "mean-cost-factor": "Mean cost factor",
     "meter": "meters",
     "meter-abbrev": "m",
+    "no-elevation-data": "No elevation data available for this route.",
     "plain-ascend": "Plain ascend",
     "stats-info": "Start drawing a route to get stats.",
     "total-energy": "Total Energy",