Browse Source

Se agrega librería wms

Maximiliano Schvindt 7 years ago
parent
commit
704f7a0a6c

+ 86 - 0
Resources/public/leaflet/leaflet-wms.js

@@ -0,0 +1,86 @@
+var layerXClickEvent = 0;
+var layerYClickEvent = 0;
+L.TileLayer.BetterWMS = L.TileLayer.WMS.extend({
+  
+  onAdd: function (map) {
+    // Triggered when the layer is added to a map.
+    //   Register a click listener, then do all the upstream WMS things
+    L.TileLayer.WMS.prototype.onAdd.call(this, map);
+    map.on('click', this.getFeatureInfo, this);
+  },
+  
+  onRemove: function (map) {
+    // Triggered when the layer is removed from a map.
+    //   Unregister a click listener, then do all the upstream WMS things
+    L.TileLayer.WMS.prototype.onRemove.call(this, map);
+    map.off('click', this.getFeatureInfo, this);
+  },
+  
+  getFeatureInfo: function (evt) {
+    layerx = evt.originalEvent.layerX;
+    layery = evt.originalEvent.layerY;
+    console.log(evt.originalEvent);
+    console.log(layerx + " " + layery);
+    
+    if(layerXClickEvent != layerx || layerYClickEvent != layery) {
+      layerXClickEvent = layerx;
+      layerYClickEvent = layery;
+      console.log("clean");
+      $("#feature").html("");
+    }
+
+    // Make an AJAX request to the server and hope for the best
+    var url = this.getFeatureInfoUrl(evt.latlng),
+        showResults = L.Util.bind(this.showGetFeatureInfo, this);
+    
+    $.ajax({
+      url: url,
+      datatype: 'application/json',
+      success: function (data, status, xhr) {
+        var err = typeof data === 'string' ? null : data;
+        showResults(err, evt.latlng, data);
+      },
+      error: function (xhr, status, error) {
+        showResults(error);  
+      }
+    });
+    
+  },
+  
+  getFeatureInfoUrl: function (latlng) {
+    
+    var point = this._map.latLngToContainerPoint(latlng, this._map.getZoom()),
+        size = this._map.getSize(),
+        params = {
+          request: 'GetFeatureInfo',
+          service: 'WMS',
+          srs: 'EPSG:4326',
+          styles: this.wmsParams.styles,
+          transparent: this.wmsParams.transparent,
+          version: this.wmsParams.version,      
+          format: this.wmsParams.format,
+          bbox: this._map.getBounds().toBBoxString(),
+          height: size.y,
+          width: size.x,
+          layers: this.wmsParams.layers,
+          query_layers: this.wmsParams.layers,
+          feature_count: 50,
+          info_format: 'application/json'
+        };
+    
+    params[params.version === '1.3.0' ? 'i' : 'x'] = point.x;
+    params[params.version === '1.3.0' ? 'j' : 'y'] = point.y;
+    
+    return this._url + L.Util.getParamString(params, this._url, true);
+    //return "{{url('api_feature_json')}}" + L.Util.getParamString(params, this._url, true);
+  }, 
+  
+  showGetFeatureInfo: function (err, latlng, content) {
+    customShowFeature(this._map, err, latlng, content);
+  }
+});
+
+L.tileLayer.betterWms = function (url, options) {
+  console.log(url);
+  return new L.TileLayer.BetterWMS(url, options);  
+};

+ 95 - 0
Resources/views/Leaflet/leaflet_wms.html.twig

@@ -0,0 +1,95 @@
+<script type="text/javascript">
+// original wms.js in leafletbundle/resources/public/js
+var layerXClickEvent = 0;
+var layerYClickEvent = 0;
+L.TileLayer.BetterWMS = L.TileLayer.WMS.extend({
+  
+  onAdd: function (map) {
+    // Triggered when the layer is added to a map.
+    //   Register a click listener, then do all the upstream WMS things
+    L.TileLayer.WMS.prototype.onAdd.call(this, map);
+    map.on('click', this.getFeatureInfo, this);
+  },
+  
+  onRemove: function (map) {
+    // Triggered when the layer is removed from a map.
+    //   Unregister a click listener, then do all the upstream WMS things
+    L.TileLayer.WMS.prototype.onRemove.call(this, map);
+    map.off('click', this.getFeatureInfo, this);
+  },
+  
+  getFeatureInfo: function (evt) {
+    layerx = evt.originalEvent.layerX;
+    layery = evt.originalEvent.layerY;
+
+    // Make an AJAX request to the server and hope for the best
+    var url = this.getFeatureInfoUrl(evt.latlng),
+        showResults = L.Util.bind(this.showGetFeatureInfo, this);
+    
+    $.ajax({
+      url: url,
+      datatype: 'json',
+      success: function (data, status, xhr) {
+        console.log(data);
+        var err = typeof data === 'string' ? null : data;
+        showResults(err, evt.latlng, data);
+      },
+      error: function (xhr, status, error) {
+        showResults(error);  
+      }
+    });
+    
+  },
+  
+  getFeatureInfoUrl: function (latlng) {
+    
+    var point = this._map.latLngToContainerPoint(latlng, this._map.getZoom()),
+        size = this._map.getSize(),
+        params = {
+          request: 'GetFeatureInfo',
+          service: 'WMS',
+          srs: 'EPSG:4326',
+          styles: this.wmsParams.styles,
+          transparent: this.wmsParams.transparent,
+          version: this.wmsParams.version,      
+          format: this.wmsParams.format,
+          bbox: this._map.getBounds().toBBoxString(),
+          height: size.y,
+          width: size.x,
+          layers: this.wmsParams.layers,
+          query_layers: this.wmsParams.layers,
+          feature_count: 1,
+          info_format: 'application/json'
+        };
+    
+    params[params.version === '1.3.0' ? 'i' : 'x'] = point.x;
+    params[params.version === '1.3.0' ? 'j' : 'y'] = point.y;
+    
+    //return this._url + L.Util.getParamString(params, this._url, true);
+    return "{{url('api_feature_json')}}" + L.Util.getParamString(params, this._url, true);
+  }, 
+  
+  showGetFeatureInfo: function (err, latlng, content) {
+    /*
+    window.map.eachLayer(function (layer) {
+      console.log(layer);
+    }); 
+    */
+
+    console.log(content);
+
+    string = "ONU: " + content.id + "<br /> Tx: " + content.tx + "<br /> Rx: " + content.rx + "<br /> Status: " + content.status + "<br /> Muestreo: " + content.muestreo;
+    popup = L.popup()
+    .setLatLng(latlng)
+    .setContent(string)
+    .openOn(window.map);
+  }
+});
+
+L.tileLayer.betterWms = function (url, options) {
+  
+  return new L.TileLayer.BetterWMS(url, options);  
+};
+
+
+</script>