0

I have enabled jsonp in geoserver/WEB-INF/web.xml. It appears in my layer preview in geoserver. I cannot seem to get my geojson layer to show up in my map. The tiles show up but with no layer. Not sure where to go from here. I have been searching through other peoples coding but no luck. Wondering if anyone could see my problem here with my code.

<html>
<head>
  <title>Geojson Leaflet</title>
  <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.css"/>
  <script src="http://schernthanner.de/leaflet-0.7.2/leaflet.js"></script>
  <script src="http://code.jquery.com/jquery-2.1.0.min.js"></script>
  <script type="text/javascript">

  <style>
    #map{ height: 100% }
  </style>
</head>
<body>

    <div id="map"></div>

    <script>

    var map = L.map( 'map', {
        center: [34.746481, -92.289595],
        minZoom: 6,
        zoom: 8
    });

    L.tileLayer( 'http://{s}.mqcdn.com/tiles/1.0.0/map/{z}/{x}/{y}.png', {

        subdomains: ['otile1','otile2','otile3','otile4']
    }).addTo( map );

    var owsrootUrl = 'http://localhost:8080/geoserver/FClassWorkspace/ows';

    var defaultParameters = {
        service : 'WFS',
        version : '1.0.0',
        request : 'GetFeature',
        typeName : 'FClassWorkspace:functclasson',
        outputFormat : 'text/javascript',
        format_options : 'callback:getJson',
        SrsName : 'EPSG:4326'
    };

    var parameters = L.Util.extend(defaultParameters);
    var URL = owsrootUrl + L.Util.getParamString(parameters);

    var WFSLayer = null;
    var ajax = $.ajax({
        url : URL,
        dataType : 'jsonp',
        jsonpCallback : 'getJson',
        success : function (response) {
            WFSLayer = L.geoJson(response, {
                style: function (feature) {
                    return {
                        stroke: false,
                        fillColor: 'FFFFFF',
                        fillOpacity: 0
                    };
                },
                onEachFeature: function (feature, layer) {
                    popupOptions = {maxWidth: 200};
                    layer.bindPopup("Popup text, access attributes with feature.properties.ATTRIBUTE_NAME"
                        ,popupOptions);
                }
            }).addTo(map);
        }
    });

  </script>
</body>
</html>
ajd018
  • 147
  • 8
  • Have you seen http://gis.stackexchange.com/questions/27468/how-do-i-get-geojson-data-from-geoserver-into-show-up-on-my-leaflet-map?rq=1 – Barbarossa Dec 03 '15 at 17:49
  • what part of this do you think applies to my issue? – ajd018 Dec 03 '15 at 18:04
  • I have it set up nicely in a WMS but I do not know how to get highlighting features and popup attribute information to work with WMS. Even after reading it still confusing. – ajd018 Dec 03 '15 at 18:32
  • Where do you define what the getJson callback does? It looks like you may not need JSONP, JSON would be enough. Anyway, in case you are missing a definition of getJson, a simple function getJson(data) { return data; } should work for your case. – ghybs Dec 04 '15 at 06:12

0 Answers0