Hi,
I am currently facing big issue with my vector layer.. Its very slow in
rendering.. Is it possible to make it render in a certain zoom level,
How can I add WMS as a display and Vector for interactivity to get
feature. by the way the vector is very large size ( Many Parcels polygons)
Here is my Code so far.
<!doctype html>
<html>
<head>
<title>Vector Examples</title>
<link rel="stylesheet" href=
"http://openlayers.org/en/v3.18.0/css/ol.css"; type="text/css">
<script src="http://openlayers.org/en/v3.18.0/build/ol.js";></script>
</head>
<body>
<div id="map" class="map"></div>
<script src="http://code.jquery.com/jquery-latest.min.js";></script>
<script>
// a tiled raster layer as the backdrop
var tiledRaster = new ol.layer.Tile({
source: new ol.source.OSM()
});
// styles for the vector layer
var fill = new ol.style.Fill({
color: 'rgba(0,0,0,0.2)'
});
var stroke = new ol.style.Stroke({
color: 'rgba(0,0,0,0.4)'
});
var circle = new ol.style.Circle({
radius: 6,
fill: fill,
stroke: stroke
});
var vectorStyle = new ol.style.Style({
fill: fill,
stroke: stroke,
image: circle
});
// when loading from a features from a remote server, we need to
provide
// a loading function that handles the actual communication
// using jQuery's ajax function, we can load the data and ask the WFS
// server to use jsonp and send the results to the loadFeatures
function
var vectorLoader = function(extent, resolution, projection) {
// var url =
'http://demo.boundlessgeo.com/geoserver/wfs?service=WFS&;' +
// 'version=1.1.0&request=GetFeature&typename=osm:builtup_area&'
+
//
'outputFormat=text/javascript&format_options=callback:loadFeatures' +
// '&srsname=EPSG:3857&bbox=' + extent.join(',') + ',EPSG:3857';
var url = 'http://gisteckno.com/geoserver/wfs?service=WFS&;' +
'version=1.1.0&request=GetFeature&typename=appraisal:planogcs&' +
'outputFormat=text/javascript&format_options=callback:loadFeatures' +
'&srsname=EPSG:3857&bbox=' + extent.join(',') + ',EPSG:3857';
$.ajax({
url: url,
dataType: 'jsonp'
});
};
// this will be called when the server data has been loaded, we can
// use the source to read the features using its configured format
var loadFeatures = function(response) {
var features = geoJSONFormat.readFeatures(response);
vectorSource.addFeatures(features);
};
// the source is configured with a format, loader function and a
// strategy, the strategy causes the loader function to be called
// in different ways. With the tile strategy, it will call with
// extents matching tile boundaries for the current zoom level
var geoJSONFormat = new ol.format.GeoJSON();
var vectorSource = new ol.source.Vector({
format: new ol.format.GeoJSON(),
loader: vectorLoader,
strategy: ol.loadingstrategy.tile(new ol.tilegrid.createXYZ({
maxZoom: 19
}))
// strategy: ol.loadingstrategy.bbox
});
// a vector layer, this time with some style options
var serverVector = new ol.layer.Vector({
source: vectorSource,
style: vectorStyle
});
var center = ol.proj.transform([-96.7542, 33.0546], 'EPSG:4326',
'EPSG:3857');
var view = new ol.View({
center: center,
zoom: 12
});
function zoomChanged() {
zoom = map.getZoom();
if (zoom >=15) {
serverVector.setVisibility(true);
}
else if (zoom < 15) {
serverVector.setVisibility(false);
}
}
var map = new ol.Map({
target: 'map',
layers: [tiledRaster, serverVector],
view: view
});
</script>
</body>
</html>
I do appreciate any help with code.
--
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/c45770d6-af57-497c-b687-796c1d84cfbd%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
