fix(shapefile): guess more EPSG codes

README.md

@@ -1,6 +1,6 @@
 # SimWrapper project website
 
-This repo contains the interactive visualization website for **SimWrapper**, available at https://simwrapper.github.io.
+This repo contains the interactive visualization website for **SimWrapper**, available at https://vsp.berlin/simwrapper
 
 - DOCS available at: https://simwrapper.github.io/docs
 

package.json

@@ -38,6 +38,7 @@
     "d3-scale-chromatic": "^1.5.0",
     "d3-selection": "^1.4.1",
     "debounce": "^1.2.0",
+    "epsg": "^0.5.0",
     "font-awesome": "^4.7.0",
     "geojson": "^0.5.0",
     "javascript-natural-sort": "^0.7.1",

src/assets/info-bottom.md

@@ -1,2 +1,2 @@
 - SimWrapper **[documentation and users guide](https://simwrapper.github.io/docs/docs/simwrapper-intro)**
-- Source code available [on Github](https://github.com/simwrapper/simwrapper.github.io)
+- Source code available [on Github](https://github.com/simwrapper/simwrapper)

src/js/Coords.ts

@@ -48,8 +48,14 @@ function toLngLat(projection: string, p: any) {
  * @returns EPSG code in "EPSG:1234" format
  */
 function guessProjection(definition: string) {
-  const favoriteEPSG = ['31468', '25832', '2048', '4326']
+  const favoriteEPSG = ['31468', '25832', '25833', '2048', '4326', '26910']
 
+  const lookups = {
+    DHDN_3_degree_Gauss_Kruger_zone_4: 'EPSG:31468',
+    NAD_1983_UTM_Zone_10N: 'EPSG:26910',
+  }
+
+  console.log(definition)
   // Simple EPSG:xxxx code? Just return it
   const epsg = /^EPSG:\d+$/
   if (epsg.test(definition)) return definition
@@ -62,17 +68,19 @@ function guessProjection(definition: string) {
     ?.reverse()
     .map(m => (matches += m))
 
-  console.log(matches)
   if (matches) {
     for (const fave of favoriteEPSG) {
       if (matches.indexOf(`"${fave}"`) > -1) return `EPSG:${fave}`
     }
   }
 
   // maybe a DHDN GK4 is there
-  if (definition.indexOf('DHDN_3_degree_Gauss_Kruger_zone_4') > -1) {
-    return 'EPSG:31468'
+  for (const [key, epsg] of Object.entries(lookups)) {
+    console.log(key, epsg)
+    console.log(definition.indexOf(key))
+    if (definition.indexOf(key) > -1) return epsg
   }
+
   // all else fails: return EPSG:31468
   return ''
 }

src/plugins/shape-file/ShapeFile.vue

@@ -56,6 +56,7 @@ de:
 <script lang="ts">
 import { Vue, Component, Prop, Watch } from 'vue-property-decorator'
 import { ToggleButton } from 'vue-js-toggle-button'
+import EPSGdefinitions from 'epsg'
 import readBlob from 'read-blob'
 import reproject from 'reproject'
 import * as shapefile from 'shapefile'
@@ -323,12 +324,10 @@ class MyPlugin extends Vue {
     const guessCRS = Coords.guessProjection(projection)
 
     // then, reproject if we have a .prj file
-    if (guessCRS) geojson = reproject.toWgs84(geojson, guessCRS)
+    if (guessCRS) geojson = reproject.toWgs84(geojson, guessCRS, EPSGdefinitions)
 
-    console.log({ geojson })
     const bbox: any = geojson.bbox
 
-    console.log({ bbox })
     const header = Object.keys(geojson.features[0].properties)
     this.shapefile = { data: geojson.features, prj: projection, header, bbox }
 

src/shims-vue.d.ts

@@ -20,6 +20,7 @@ declare module 'bulma-slider'
 declare module 'colormap'
 declare module 'convert-seconds'
 declare module 'd3-sankey-diagram'
+declare module 'epsg'
 declare module 'javascript-natural-sort'
 declare module 'read-blob'
 declare module 'reproject'

src/views/SplashPage.vue

@@ -28,7 +28,7 @@
 <i18n>
 en:
   more-info: 'For more information:'
-  tagLine: 'the model output browser and data visualizer from TU&nbsp;Berlin.'
+  tagLine: 'the simulation output browser and data visualizer from TU&nbsp;Berlin.'
 de:
   more-info: 'Für weitere Informationen:'
   tagLine: 'Der Modellergebnis-Browser der TU Berlin.'