[Openlayers] Loading vector slices in ol can effectively solve the problem of large data volume. In win7, tilestache is used to generate tiles in geojson format.

Source: Internet
Author: User

1. tilestache can be used to segment vector data.

Use tilestache in win7 to generate tiles in geojson format

This is pre-cut data.
You can also obtain slice data in real time (using ol -- utfgrid) See http://blog.perrygeo.net/2012/02... ERs-and-tilestache/

2. The following describes how to load pre-cut data in openlayers.

Add the ol policy extension file openlayers. Strategy. Grid. js

Load layer:

var style = new OpenLayers.Style();          var ruleAmenity = new OpenLayers.Rule({               symbolizer: {fillColor: 'none', strokeOpacity: 0, pointerEvents: 'all'}           });                    style.addRules([ruleAmenity]);          var styleMap = new OpenLayers.StyleMap({              'default': style,              'select': new OpenLayers.Style({                  strokeWidth: 5,                  strokeColor: "blue",                  strokeOpacity: 1              })          });        var baseName = "http://localhost/basicmap/data/${z}/${x}/${y}";        format = new OpenLayers.Format.GeoJSON();        strategy = new OpenLayers.Strategy.Grid();        protocol = new OpenLayers.Protocol.HTTP({            url: baseName + ".geojson",            format: format        });        vectors = new OpenLayers.Layer.Vector("Vector", {            strategies: [strategy],            protocol: protocol,            styleMap:styleMap,            projection: new OpenLayers.Projection("EPSG:4326")        });    this.map.addLayer(vectors);    var options = {               hover: true           };           var select = new OpenLayers.Control.SelectFeature(vectors, options);           this.map.addControl(select);           select.activate();
The following points should be noted: 1. By default, tilestache splits data by epsg: 900913, so the map here is also epsg: 900913 projection.
    var mapOptions = {        maxExtent : new OpenLayers.Bounds(-20037508.3427892, -20037508.3427892,        20037508.3427892, 20037508.3427892),        numZoomLevels : 19,        maxResolution : 156543.0339,         controls: [],        units : 'm',        projection : "EPSG:900913",        displayProjection : new OpenLayers.Projection("EPSG:4326"),        theme : 'css/OlTheme/default/style.css'         };    this.map = new OpenLayers.Map('map', mapOptions);

Load geojson slices:

You can check the data.

 

 

Highlight when you move the mouse over the icon (the icon is rendered by the background geoserver ):

 

 

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.