OPENLAYERS3 Basic Tutorial--loading resources

Overview:

This section describes how to load a WMS layer in OL3 and display it in a map.

OL3 Download:

You can download in OL official website, for http://openlayers.org/download/, also can go to my Baidu cloud disk download, for Http://pan.baidu.com/s/1o6wwHTo. The latest version of the official website is 3.6.0, the version of My network disk is 3.0.0, but the link on the official website seems to be invalid.

OL3 must introduce resources:

OL3 must be introduced with two resources, one for style files, ol.css; one for JS files, ol.js.

OL3 Loading WMS:

In Ol3, the WMS can be loaded in two ways, one of which is Ol.layer. Image, whose corresponding resource is Ol.source. Imagewms, the way he defines it, is:

var untiled = new Ol.layer.Image ({source:new Ol.source.ImageWMS ({ratio:1,url: ' http://localhost:8081/geoserver/ Lzugis/wms ', params: {' format ': Format, ' VERSION ': ' 1.1.1 ', LAYERS: ' Lzugis:province ', STYLES: '}}});

One is ol.layer. Tile, and its corresponding resource is Ol.source. tilewms, it is defined in the following way:

var tiled = new Ol.layer.Tile ({visible:false,source:new ol.source.TileWMS ({url: ' http://localhost:8080/geoserver/ Lzugis/wms ', params: {' format ': Format, ' VERSION ': ' 1.1.1 ', tiled:true,layers: ' Lzugis:province ', STYLES: '}}});

Show Resources:

OL3 Displays resources using map, a map instance includes target, the id;layers of the map display Div, a collection of layers for the map to be realistic, and a view, including projections, center points, and other information, defined in the following way:

var map = new ol. Map ({controls:ol.control.defaults {attribution:false}), Target: ' Map ', layers: [Untiled,tiled],view:new ol. View ({PROJECTION:PROJECTION,ROTATION:MATH.PI/6})}); Map.getview (). Fitextent (Bounds, map.getsize ());

Connect the above content, the complete code is as follows:

Related courses:
Basic concepts of OPENLAYERS3 Basic tutorial--ol3







 
Copyright NOTICE: This article for Bo Master original article, without Bo Master permission not reproduced.
 
OPENLAYERS3 Basic Tutorial--loading resources