CODEWITHSUNDEEP
openlayers-3
connie
connie

Reputation: 117

how to load image as base layer for further drawing in openlayer 3

How to load selected image as base layer for further features like point/polygon/shape to draw onto it. Most of the examples shown on openlayer website, are using "ol.source.OSM" for as base layer source. I don't want to use the OSM as based layer.

Upvotes: 0

Views: 1050

Answers (1)

Icarus
Icarus

Reputation: 1647

An example of loading custom images can be found in the Openlayers site, under Image Load Event.

You have to take care about the format of the picture you want to load. As you didn't provide more information, I will use a single, untiled image from a WMS server.

The following snippet is the part of the code which should help you.

var map = new ol.Map( {
  layers: [
    new ol.layer.Image( {
      source: new ol.source.ImageWMS( {
        url: 'https://ahocevar.com/geoserver/wms',
        params: {
          'LAYERS': 'topp:states'
        },
        serverType: 'geoserver'
      } )
    } )
  ],
  target: 'map',
  view: new ol.View( {
    center: [-10997148, 4569099],
    zoom: 4
  } )
} );
<script src="https://openlayers.org/en/v3.20.1/build/ol.js"></script>
<div id="map"></div>

Upvotes: 1

Related Questions