Below is my code to render the map with a jsonp layer from geoserver.
However, when I change the center: [0, 0] to center: [-49164938, 5405891],
the jsonp layer disappears. The layer appear when I rechange the center
line to center: ol.proj.transform([-75.923853, 45.428736],
'EPSG:4326', 'EPSG:3857'). I do not know what the back-end mechanism to
control this.
<!doctype html>
<html>
<head>
<title>OpenLayers Components</title>
<link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/ol3/3.18.2/ol-debug.css";
type="text/css" />
</head>
<body>
<div id="map"></div>
<script src="http://openlayers.org/en/v3.4.0/build/ol.js";
type="text/javascript"></script>
<script src="https://code.jquery.com/jquery-3.1.0.js";
integrity="sha256-slogkvB1K3VOkzAI8QITxV3VzpOnkeNVsKvtkYLMjfk="
crossorigin="anonymous"></script>
<script>
var osmLayer = new ol.layer.Tile({
source: new ol.source.OSM()
});
var vectorSourceJsonp = new ol.source.ServerVector({
format: new ol.format.GeoJSON(),
loader: function(extent, resolution, projection) {
var url = 'http://localhost:8080/geoserver/gullycreek/ows?' +
'service=WFS&request=GetFeature&' +
'version=1.1.0&typename=gullycreek:subbasin&' +
'outputFormat=text/javascript&' +
'format_options=callback:loadFeatures&' +
'srsname=EPSG:3857';
$.ajax({
url: url,
dataType: 'jsonp'
});
},
strategy: ol.loadingstrategy.createTile(new ol.tilegrid.XYZ({
maxZoom: 19
})),
projection: 'EPSG:3857'
});
// Executed when data is loaded by the $.ajax method.
var loadFeatures = function(response) {
vectorSourceJsonp.addFeatures(vectorSourceJsonp.readFeatures(response));
};
// Vector layer
var vectorLayerJsonp = new ol.layer.Vector({
source: vectorSourceJsonp,
style: new ol.style.Style({
stroke: new ol.style.Stroke({
color: 'green',
width: 2
})
})
});
// Map
var mapJsonp = new ol.Map({
target: 'map',
renderer: 'canvas',
layers: [osmLayer, vectorLayerJsonp],
view: new ol.View({
center: [0, 0],
zoom: 13
})
});
</script>
</body>
</html>
--
You received this message because you are subscribed to the Google Groups "OL3
Dev" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at https://groups.google.com/group/ol3-dev.
To view this discussion on the web visit
https://groups.google.com/d/msgid/ol3-dev/a1a5c8ee-edf5-4df3-869d-892e87550aa0%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
