@eturnity/eturnity_3d 0.0.4

package/src/utils/layers.js

@@ -0,0 +1,265 @@
+import * as L from 'leaflet'
+import 'leaflet.gridlayer.googlemutant'
+import { leafletMapLayersConfig } from './leaflet-config.service'
+
+function getLayers() {
+  const googleLayer = L.gridLayer.googleMutant({
+    type: 'hybrid',
+    layerTypeAPI: 'googleLayer',
+    maxNativeZoom: 25,
+    maxZoom: 25
+  })
+  const googleLayerRoadmap = L.gridLayer.googleMutant({
+    type: 'roadmap',
+    layerTypeAPI: 'googleLayerRoadmap',
+    maxNativeZoom: 25,
+    maxZoom: 25
+  })
+  const googleLayerTerrain = L.gridLayer.googleMutant({
+    type: 'terrain',
+    layerTypeAPI: 'googleLayerTerrain',
+    maxNativeZoom: 25,
+    maxZoom: 25
+  })
+  // TODO activate for different users
+  const baseMapLayer = L.tileLayer(
+    'http://{s}.wien.gv.at/basemap/geolandbasemap/normal/google3857/{z}/{y}/{x}.png',
+    {
+      id: 'basemap',
+      subdomains: ['maps', 'maps1', 'maps2', 'maps3', 'maps4'],
+      attribution:
+        'Datenquelle: <a href="http://www.basemap.at/">basemap.at</a>',
+      // TODO not defined
+      minZoom: leafletMapLayersConfig['baseMapLayer']['minZoom'],
+      maxZoom: leafletMapLayersConfig['baseMapLayer']['maxZoom'],
+      maxNativeZoom: leafletMapLayersConfig['baseMapLayer']['maxNativeZoom'],
+      layerTypeAPI: 'baseMapLayer'
+    }
+  )
+  const baseMapLayerStreetNumber = L.tileLayer(
+    'http://{s}.wien.gv.at/basemap/bmaporthofoto30cm/normal/google3857/{z}/{y}/{x}.jpeg',
+    {
+      id: 'basemap_bmaporthofoto30cm',
+      subdomains: ['maps', 'maps1', 'maps2', 'maps3', 'maps4'],
+      attribution:
+        'Datenquelle: <a href="http://www.basemap.at/">basemap.at</a>',
+      // TODO not defined
+      minZoom: leafletMapLayersConfig['baseMapLayerStreetNumber']['minZoom'],
+      maxZoom: leafletMapLayersConfig['baseMapLayerStreetNumber']['maxZoom'],
+      maxNativeZoom:
+        leafletMapLayersConfig['baseMapLayerStreetNumber']['maxNativeZoom'],
+      layerTypeAPI: 'baseMapLayerStreetNumber'
+    }
+  )
+  const swisstopoLayer_swissimage = L.tileLayer(
+    'https://wmts10.geo.admin.ch/1.0.0/ch.swisstopo.swissimage/default/current/3857/{z}/{x}/{y}.jpeg',
+    {
+      id: 'swisstopo_swissimage',
+      subdomains: ['maps', 'maps1', 'maps2', 'maps3', 'maps4'],
+      attribution:
+        'Datenquelle: <a href="https://www.geo.admin.ch">geo.admin.ch</a>',
+      maxZoom: leafletMapLayersConfig['swisstopoLayer_swissimage']['maxZoom'],
+      maxNativeZoom:
+        leafletMapLayersConfig['swisstopoLayer_swissimage']['maxNativeZoom'],
+      layerTypeAPI: 'swisstopoLayer_swissimage'
+    }
+  )
+  const swisstopoLayer_pixelkarte = L.tileLayer(
+    'https://wmts10.geo.admin.ch/1.0.0/ch.swisstopo.pixelkarte-farbe/default/current/3857/{z}/{x}/{y}.jpeg',
+    {
+      id: 'swisstopo_pixelkarte',
+      subdomains: ['maps', 'maps1', 'maps2', 'maps3', 'maps4'],
+      attribution:
+        'Datenquelle: <a href="https://www.geo.admin.ch">geo.admin.ch</a>',
+      maxZoom: leafletMapLayersConfig['swisstopoLayer_pixelkarte']['maxZoom'],
+      maxNativeZoom:
+        leafletMapLayersConfig['swisstopoLayer_pixelkarte']['maxNativeZoom'],
+      layerTypeAPI: 'swisstopoLayer_pixelkarte'
+    }
+  )
+  const swisstopoLayer_solarenergie_fassade = L.tileLayer(
+    'https://wmts10.geo.admin.ch/1.0.0/ch.bfe.solarenergie-eignung-fassaden/default/current/3857/{z}/{x}/{y}.png',
+    {
+      id: 'swisstopo_solarenergie_fassade',
+      // subdomains: ['maps', 'maps1', 'maps2', 'maps3', 'maps4'],
+      attribution:
+        'Datenquelle: <a href="https://www.geo.admin.ch">geo.admin.ch</a>',
+      maxZoom:
+        leafletMapLayersConfig['swisstopoLayer_solarenergie_fassade'][
+          'maxZoom'
+        ],
+      maxNativeZoom:
+        leafletMapLayersConfig['swisstopoLayer_solarenergie_fassade'][
+          'maxNativeZoom'
+        ],
+      layerTypeAPI: 'swisstopoLayer_solarenergie_fassade'
+    }
+  )
+  const swisstopoLayer_solarenergie_roof = L.tileLayer(
+    'https://wmts10.geo.admin.ch/1.0.0/ch.bfe.solarenergie-eignung-daecher/default/current/3857/{z}/{x}/{y}.png',
+    {
+      id: 'swisstopo_solarenergie_roof',
+      // subdomains: ['maps', 'maps1', 'maps2', 'maps3', 'maps4'],
+      attribution:
+        'Datenquelle: <a href="https://www.geo.admin.ch">geo.admin.ch</a>',
+      maxZoom:
+        leafletMapLayersConfig['swisstopoLayer_solarenergie_roof']['maxZoom'],
+      maxNativeZoom:
+        leafletMapLayersConfig['swisstopoLayer_solarenergie_roof'][
+          'maxNativeZoom'
+        ],
+      layerTypeAPI: 'swisstopoLayer_solarenergie_roof'
+    }
+  )
+  const openStreetMapLayer = L.tileLayer(
+    'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
+    {
+      id: 'osm',
+      attribution:
+        '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors',
+      minZoom: leafletMapLayersConfig['openStreetMapLayer']['minZoom'],
+      maxZoom: leafletMapLayersConfig['openStreetMapLayer']['maxZoom'],
+      maxNativeZoom:
+        leafletMapLayersConfig['openStreetMapLayer']['maxNativeZoom'],
+      layerTypeAPI: 'openStreetMapLayer'
+    }
+  )
+  const ignLayerPNOAImage = L.tileLayer(
+    'https://www.ign.es/wmts/pnoa-ma?layer={layer}&tilematrixset={tilematrixset}&Service=WMTS&Request=GetTile&Version=1.0.0&Format={format}&TileMatrix={z}&TileCol={x}&TileRow={y}',
+    {
+      layer: 'OI.OrthoimageCoverage',
+      tilematrixset: 'EPSG:3857',
+      format: 'image/jpeg',
+      id: 'ign_pnoa',
+      attribution:
+        '&copy; <a href="https://pnoa.ign.es" target="_blank">PNOA</a>',
+      maxZoom: leafletMapLayersConfig['ignSpainLayer_pnoa_image']['maxZoom'],
+      maxNativeZoom:
+        leafletMapLayersConfig['ignSpainLayer_pnoa_image']['maxNativeZoom'],
+      layerTypeAPI: 'ignSpainLayer_pnoa_image'
+    }
+  )
+  const ignLayerMap = L.tileLayer(
+    'https://www.ign.es/wmts/ign-base?layer={layer}&tilematrixset={tilematrixset}&Service=WMTS&Request=GetTile&Version=1.0.0&Format={format}&TileMatrix={z}&TileCol={x}&TileRow={y}',
+    {
+      layer: 'IGNBaseTodo',
+      tilematrixset: 'EPSG:3857',
+      format: 'image/jpeg',
+      id: 'ign_map',
+      attribution:
+        '&copy; <a href="https://www.ign.es/web/ign/portal" target="_blank">IGN</a>',
+      maxZoom: leafletMapLayersConfig['ignSpainLayer_map']['maxZoom'],
+      maxNativeZoom:
+        leafletMapLayersConfig['ignSpainLayer_map']['maxNativeZoom'],
+      layerTypeAPI: 'ignSpainLayer_map'
+    }
+  )
+  const bkgHexagonImage = L.tileLayer.wms(
+    'https://terramapserver.org/Proxy/geoserver/BKG/wms?kid=eag20.1',
+    {
+      layers: 'rgb',
+      id: 'bkg_image',
+      attribution:
+        '&copy; <a href="https://www.bkg.bund.de" target="_blank">Bundesamt für Kartographie und Geodäsie</a>',
+      maxZoom: leafletMapLayersConfig['bkgHexagonGermanyLayer']['maxZoom'],
+      maxNativeZoom:
+        leafletMapLayersConfig['bkgHexagonGermanyLayer']['maxNativeZoom'],
+      layerTypeAPI: 'bkgHexagonGermanyLayer'
+    }
+  )
+  const GeoLayer_HR = L.tileLayer(
+    'https://wxs.ign.fr/ortho/geoportail/wmts?' +
+      '&REQUEST=GetTile&SERVICE=WMTS&VERSION=1.0.0' +
+      '&STYLE=normal' +
+      '&TILEMATRIXSET=PM' +
+      '&FORMAT=image/jpeg' +
+      '&LAYER=HR.ORTHOIMAGERY.ORTHOPHOTOS' +
+      '&TILEMATRIX={z}' +
+      '&TILEROW={y}' +
+      '&TILECOL={x}',
+    {
+      layers: 'HR.ORTHOIMAGERY.ORTHOPHOTOS',
+      id: 'HR.ORTHOIMAGERY.ORTHOPHOTOS',
+      attribution: '© IGN-F/Geoportail France',
+      minZoom: leafletMapLayersConfig['GeoPortal']['minZoom'],
+      maxZoom: leafletMapLayersConfig['GeoPortal']['maxZoom'],
+      maxNativeZoom: leafletMapLayersConfig['GeoPortal']['maxNativeZoom'],
+      tileSize: 256,
+      layerTypeAPI: 'geoportail_fr_wmts_ortho_layer'
+    }
+  )
+
+  return [
+    {
+      name: 'SwissTopo (satellite)',
+      key: 'swisstopoLayer_swissimage',
+      layerData: swisstopoLayer_swissimage
+    },
+    {
+      name: 'SwissTopo (map)',
+      key: 'swisstopoLayer_pixelkarte',
+      layerData: swisstopoLayer_pixelkarte
+    },
+    {
+      name: 'SwissTopo (Solar energy: suitability of roofs)',
+      key: 'swisstopoLayer_solarenergie_roof',
+      layerData: swisstopoLayer_solarenergie_roof
+    },
+    {
+      name: 'SwissTopo (Solarenergie: suitability of facade)',
+      key: 'swisstopoLayer_solarenergie_fassade',
+      layerData: swisstopoLayer_solarenergie_fassade
+    },
+    {
+      name: 'OpenStreetMap',
+      key: 'openStreetMapLayer',
+      layerData: openStreetMapLayer
+    },
+    {
+      name: 'Google (terrain)',
+      key: 'googleLayerTerrain',
+      layerData: googleLayerTerrain
+    },
+    {
+      name: 'Google (roadmap)',
+      key: 'googleLayerRoadmap',
+      layerData: googleLayerRoadmap
+    },
+    {
+      name: 'Google (satellite)',
+      key: 'googleLayer',
+      layerData: googleLayer
+    },
+    {
+      name: 'Basemap.at (roadmap)',
+      key: 'baseMapLayer',
+      layerData: baseMapLayer
+    },
+    {
+      name: 'Basemap.at (satellite)',
+      key: 'baseMapLayerStreetNumber',
+      layerData: baseMapLayerStreetNumber
+    },
+    {
+      name: 'IGN (PNOA satellite image)',
+      key: 'ignSpainLayer_pnoa_image',
+      layerData: ignLayerPNOAImage
+    },
+    {
+      name: 'IGN (roadmap)',
+      key: 'ignSpainLayer_map',
+      layerData: ignLayerMap
+    },
+    {
+      name: 'BKG satellite image',
+      key: 'bkgHexagonGermanyLayer',
+      layerData: bkgHexagonImage
+    },
+    {
+      name: 'GeoPortal France (satellite)',
+      key: 'geoportail_fr_wmts_ortho_layer',
+      layerData: GeoLayer_HR
+    }
+  ]
+}
+export default getLayers

package/src/utils/leaflet-config.service.js

@@ -0,0 +1,67 @@
+export const leafletMapLayersConfig = {
+  baseMapLayer: {
+    // Basemap.at
+    maxZoom: 21,
+    maxNativeZoom: 19,
+    minZoom: 0
+  },
+  baseMapLayerStreetNumber: {
+    // Basemap.at (satellite)
+    maxZoom: 21,
+    maxNativeZoom: 19,
+    minZoom: 0
+  },
+  swisstopoLayer_swissimage: {
+    // SwissTopo (satellite)
+    maxZoom: 25,
+    maxNativeZoom: 20,
+    minZoom: 0
+  },
+  swisstopoLayer_pixelkarte: {
+    // SwissTopo (map)
+    maxZoom: 25,
+    maxNativeZoom: 18,
+    minZoom: 0
+  },
+  swisstopoLayer_solarenergie_fassade: {
+    // SwissTopo (Solarenergie: Eignung Fassaden)
+    maxZoom: 25,
+    maxNativeZoom: 18,
+    minZoom: 0
+  },
+  swisstopoLayer_solarenergie_roof: {
+    // SwissTopo (Solar energy: suitability of roofs)
+    maxZoom: 25,
+    maxNativeZoom: 18,
+    minZoom: 0
+  },
+  openStreetMapLayer: {
+    // OpenStreetMap
+    maxZoom: 21,
+    maxNativeZoom: 19,
+    minZoom: 0
+  },
+  ignSpainLayer_pnoa_image: {
+    // Spain (satellite)
+    maxZoom: 25,
+    maxNativeZoom: 20,
+    minZoom: 0
+  },
+  ignSpainLayer_map: {
+    // Spain (map)
+    maxZoom: 25,
+    maxNativeZoom: 20,
+    minZoom: 0
+  },
+  bkgHexagonGermanyLayer: {
+    // Germany (satellite)
+    maxZoom: 25,
+    maxNativeZoom: 22,
+    minZoom: 0
+  },
+  GeoPortal: {
+    maxZoom: 22,
+    maxNativeZoom: 19,
+    minZoom: 6
+  }
+}

package/vue.config.js

@@ -0,0 +1,46 @@
+const HtmlWebPackPlugin = require('html-webpack-plugin')
+const path = require('path')
+
+module.exports = {
+  configureWebpack: {
+    resolve: {
+      alias: {
+        '@/': path.resolve(__dirname, 'src/')
+      }
+    },
+    entry: path.resolve(__dirname, 'src/main.js'),
+    optimization: {
+      splitChunks: {
+        cacheGroups: {
+          vendors: {
+            chunks: (chunk) => false
+          }
+        }
+      },
+      minimize: false,
+      usedExports: true
+    },
+    output: {
+      path: path.resolve(__dirname, 'dist'),
+      filename: 'main.js',
+      library: 'Three_d_viewer',
+      libraryTarget: 'umd'
+    },
+    module: {
+      rules: [
+        {
+          test: /\.(js)$/,
+          // exclude: /\node_modules/,
+          use: 'babel-loader'
+        },
+      ]
+    },
+    plugins: [
+      new HtmlWebPackPlugin({
+        template: './index.html',
+        inject: 'head',
+        baseUrl: '/'
+      })
+    ]
+  }
+}