CP-999-02

OL - Consumo recursos - LINEAS

by SIGC

HTML

<script src="https://sigc.desarrollo.guadaltel.es/mapea5/js/mapea.ol.min.js"></script>
<link rel="stylesheet" href="https://sigc.desarrollo.guadaltel.es/mapea5/assets/css/mapea.ol.min.css">
<script src="https://sigc.desarrollo.guadaltel.es/mapea5/js/configuration.js"></script>
<div id="mapjs"></div>

CSS

<style rel="stylesheet">
      html,
      body {
        margin: 0;
        padding: 0;
        height: 100%;
        overflow: hidden;
      }

JavaScript

let source = new ol.source.Vector({
  format: new ol.format.GeoJSON(),
  url: 'https://clientes.guadaltel.es/desarrollo/geossigc/mapea/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=mapea:mapb_vc1_100&outputFormat=application/json&srsname=EPSG:4326',
  strategy: ol.loadingstrategy.bbox
});

let vector = new ol.layer.Vector({
  source: source,
});

let map = new ol.Map({
  view: new ol.View({
    center: [-4, 37],
    zoom: 6,
    projection: 'EPSG:4326',
  }),
  layers: [
    new ol.layer.Tile({
      source: new ol.source.OSM()
    }),
    vector
  ],
  target: 'mapjs',
});

vector.setStyle(new ol.style.Style({
  stroke: new ol.style.Stroke({
    width: 2,
    color: 'rgba(255, 100, 50, 0.8)'
  }),
}));