@skymapglobal/map-layer-management

Layer management control

Usage no npm install needed!

<script type="module">
  import skymapglobalMapLayerManagement from 'https://cdn.skypack.dev/@skymapglobal/map-layer-management';
</script>

README

Skymap Map Layer Management

Layer management control

Install

yarn add @skymapglobal/map @skymapglobal/map-layer-management

Usage

<template>
  <div id="app">
    <map>
      <BaseMapControl position="top-right" />

      <LayerManagementModule position="top-right" />
    </map>
  </div>
</template>

<script>
  import { Map, BaseMapControl } from "@skymapglobal/map";
  import { LayerManagementModule } from "@skymapglobal/map-layer-management";

  export default {
    name: "App",

    components: {
      Map,
      BaseMapControl,
      LayerManagementModule,
    },
  };
</script>

<style>
  html,
  body,
  #app {
    width: 100%;
    height: 100%;
    overflow: hidden;
    padding: 0;
    margin: 0;
  }

  #app {
    font-family: Avenir, Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }

  *,
  *::before,
  *::after {
    box-sizing: border-box;
  }
</style>

Features

  • Layer Tree, Layer Group

  • Upload Vector Layers: GeoJSON (.json, .geojson), Shapefiles (.dbf, .prj, .cpg, .shp), GPX, KML, KMZ, CSV, GML, WKT

  • Download Vector Layers: geojson, shapefiles, csv, gml, gpx, kml, wkt

  • Add Layer

    • Raster

      • Web Map Service

      • Tile Map Service

    • Vector

      • Polygon

      • LineString

      • Point

  • Change Raster, Vector Layer Style

  • Manage Vector Feature's Geometries, Attributes