SvgTileLayer.js

SvgTileLayer()


constructor
Inherits from TileLayer

The class responsible for adding svg tiles of a specific type and style to the map.

Options:
  • mapType(MapTypes)The map tiles type (default: STANDARD)
  • mapStyle(MapStyles)The map tiles style (default: LIGHT)
Parameter Type Description
options Object The layer options

Example

$(document).ready(function () {
  var mapContainer = T.DomUtil.get('map')
  var svgLayer = new T.SvgTileLayer('https://geoanalytics.tibco.com/vector/all/{z}/{x}/{y}.json')

  var map = new T.Map(mapContainer, {
    zoom: 6,
    center: new T.LatLng(48.87674029344714, 2.2918101478408777),
    urlLocation: false
  })

  map.addLayer(svgLayer)
})
<!DOCTYPE html>
<html>

<head>
  <title>TibcoMaps - Svg Tibco Layer</title>
  <meta charset="UTF-8">

  <link rel="stylesheet" href="svg-tile-layer.css"/>
  <link rel="stylesheet" href='../lib/fonts-stylesheet.css' type="text/css" charset="utf-8" />

  <!-- Javascript -->
  <script type="text/javascript" src='../lib/GeoAnalytics.js'></script>
  <script type="text/javascript" src='../lib/jquery-1.9.1.min.js'></script>
  <script type="text/javascript" src="svg-tile-layer.js"></script>
</head>

  <body>
    <div class="custom-container">
      <div id="map"></div>
    </div>
  </body>
</html>
body,
html {
  height: 100%;
  width: 100%;
  margin: 0px;
}

.custom-container {
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
}

#map {
  width: 100vw;
  height: 100vh;
}