Adding a new lvector.PRWSF layer

438 views
Skip to first unread message

m_travis

unread,
May 1, 2013, 4:48:00 PM5/1/13
to leaflet-ve...@googlegroups.com
Hi  there

I'm trying to add a new lvector.PRWSF layer to my leaflet map. I have the dirt-simple-postgis web service framework set up ok but can't seem to get the layer to add to the map. 

Could you have a look at this code for me and tell me where I'm going wrong (probably something obvious!)

Thanks, Matt
------------------------------------------------------------------------------------------------------------------------------------------------------------

<!DOCTYPE html>
<html>
<head>
<title>Leaflet - PRWSF Example</title>
<meta charset="utf-8" />

<meta name="viewport" content="width=device-width, initial-scale=1.0">


<link rel="stylesheet" href="http://localhost/leaflet/leaflet/leaflet.css" />
<!--[if lte IE 8]>
    <link rel="stylesheet" href="http://localhost/leaflet/leaflet/leaflet.ie.css" />
<![endif]-->


</head>
<body>


<div id="map" style="width: 1000px; height: 800px"></div>


<script>
var map = L.map('map').setView([50.370, -4.14], 14);
maxZoom: 18,
attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="http://cloudmade.com">CloudMade</a>'
}).addTo(map);
var myPrwsfLayer = new lvector.PRWSF({
    geotable: "masts2",
    fields: "gid",
geomFieldName: "geom",
    uniqueField: "gid",
    geomPrecision: 6,
    srid: 4326,
    symbology: {
        type: "single",
        vectorOptions: {
            fillColor: "red",
            fillOpacity: 0.1,
            strokeWeight: 0.8,
            strokeColor: "#2f4a00",
            strokeOpacity: 1,
            clickable: false
        }
    }}).setMap(map);

</script>
</body>
</html>



Bryan McBride

unread,
May 1, 2013, 5:01:27 PM5/1/13
to leaflet-ve...@googlegroups.com
Hi Matt,

I can think of a couple of issues that may be working against you.

First, I think you may be missing a few scripts. Rather than loading the individual source files, try loading the lvector.js file from the dist directory: https://github.com/JasonSanford/leaflet-vector-layers/blob/master/dist/lvector.js.

Second, I believe PRWSF is built to use the old framework located here: https://code.google.com/p/postgis-restful-web-service-framework/. I'm not sure if Jason has any plans to add a DSPHA layer, but I wrote a simple PHPPGGeoJSON class for loading PostGIS directly from a simple PHP script. Let me know if you are interested and I can get you the details.

BRYAN

Matt Travis

unread,
May 1, 2013, 5:22:49 PM5/1/13
to leaflet-ve...@googlegroups.com
Hi Bryan

Thanks for getting back to me so quickly. I tried adding the file from the dist but that didn't work. 

Its a shame that vector layers won't work with the DSPHA but If you have another method that you could share would me that would be most excellent!

I did see your github page and had a go at using postgis_geojson.php but couldn't work out how to translate that into a layer in leaflet. 

Cheers

Matt

--
You received this message because you are subscribed to the Google Groups "Leaflet Vector Layers" group.
To unsubscribe from this group and stop receiving emails from it, send an email to leaflet-vector-l...@googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.
 
 

Bryan McBride

unread,
May 1, 2013, 5:34:19 PM5/1/13
to leaflet-ve...@googlegroups.com
If you don't need all the extras of LVL and you just want to load your PostGIS data into Leaflet, you should be able to use that PHP script that you referenced. That basically spits your data out of PostGIS into GeoJSON than can be consumed by Leaflet.

First check to see that the script is returning some GeoJSON data. Run: http://localhost/postgis_geojson.php in your browser and make sure you get something back.

Once you have that working, just add that data to your GeoJSON layer with an AJAX call (I use jQuery) like so:

var myLayer = new L.geoJson(null, {
  pointToLayer: function (feature, latlng) {
    return L.marker(latlng, {
    });
  },
  onEachFeature: function (feature, layer) {
    if (feature.properties) {
      layer.bindPopup(feature.properties.my_attribute);
    }
  }
});
$.getJSON("postgis_geojson.php", function (data) {
    myLayer.addData(data);
});
Matt

To unsubscribe from this group and stop receiving emails from it, send an email to leaflet-vector-layers+unsub...@googlegroups.com.

Matt Travis

unread,
May 3, 2013, 12:25:21 PM5/3/13
to leaflet-ve...@googlegroups.com
Hi Brian. 

I tested you php it it defintiely work. When I use your other code in page it is still not loading the layer still. Am I missing somethng?

<!DOCTYPE html>
<html>
<head>
<title>Leaflet - PRWSF Example</title>
<meta charset="utf-8" />

<meta name="viewport" content="width=device-width, initial-scale=1.0">


<link rel="stylesheet" href="http://localhost/leaflet/leaflet/leaflet.css" />
<!--[if lte IE 8]>
    <link rel="stylesheet" href="http://localhost/leaflet/leaflet/leaflet.ie.css" />
<![endif]-->


</head>
<body>


<div id="map" style="width: 1000px; height: 800px"></div>



<script>
var map = L.map('map').setView([50.370, -4.14], 14);
maxZoom: 18,
attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="http://cloudmade.com">CloudMade</a>'
}).addTo(map);

var myLayer = new L.geoJson(null, {
  pointToLayer: function (feature, latlng) {
    return L.marker(latlng, {
    });
  },
  onEachFeature: function (feature, layer) {
    if (feature.properties) {
      layer.bindPopup(feature.properties.operator);
    }
  }
});
$.getJSON("postgis_geojson.php", function (data) {
    myLayer.addData(data);
}).addTo(map);

To unsubscribe from this group and stop receiving emails from it, send an email to leaflet-vector-l...@googlegroups.com.

Bryan McBride

unread,
May 6, 2013, 9:48:51 AM5/6/13
to leaflet-ve...@googlegroups.com
Are you getting any errors in your JavaScript console? Do you have a live version or jsfiddle I can take a look at?
--
Bryan R. McBride, GISP
bryanmcbride.com

Matt Travis

unread,
May 6, 2013, 10:54:52 AM5/6/13
to leaflet-ve...@googlegroups.com
Hi Bryan


The php script is in the same directory and produces this geojson: http://mtravismaps.no-ip.org/leaflet/leaflet/postgis_geojson.php

Cheers

Matt

Bryan McBride

unread,
May 6, 2013, 11:52:57 AM5/6/13
to leaflet-ve...@googlegroups.com
I'm having issues accessing these links...

Matt Travis

unread,
May 6, 2013, 12:26:58 PM5/6/13
to leaflet-ve...@googlegroups.com
Try this jsfiddle: http://jsfiddle.net/yakus/CNBSc/1/

Cheers

Matt
Reply all
Reply to author
Forward
0 new messages