Sign Up for Free

RunKit +

Try any Node.js package right in your browser

This is a playground to test code. It runs a full Node.js environment and already has all of npm’s 400,000 packages pre-installed, including ol with all npm packages installed. Try it out:

var ol = require("ol")

This service is provided by RunKit and is not affiliated with npm, Inc or the package authors.

ol v4.3.3

OpenLayers as ES2015 modules

ol

OpenLayers as ES2015 modules.

Usage

Add the ol package as a dependency to your project.

npm install ol --save

Import just what you need for your application:

import Map from 'ol/map';
import View from 'ol/view';
import TileLayer from 'ol/layer/tile';
import XYZ from 'ol/source/xyz';

new Map({
  target: 'map',
  layers: [
    new TileLayer({
      source: new XYZ({
        url: 'https://{a-c}.tile.openstreetmap.org/{z}/{x}/{y}.png'
      })
    })
  ],
  view: new View({
    center: [0, 0],
    zoom: 2
  })
});

See the following examples for more detail on bundling OpenLayers with your application:

Module Identifiers

The module identifiers above (e.g. ol/map) are like the ol.Map names in the API documentation with / instead of . and all lowercase. Each module only has a default export (there are no other named exports).

Constructors are exported from dedicated modules. For example, the ol/layer/tile module exports the Tile layer constructor.

Utility functions are available as properties of the default export from utility modules. For example, the getCenter function is a property of the default export from the ol/extent utility module.

Caveats

  • The WebGL renderer is not available in this package.

Metadata

RunKit is a free, in-browser JavaScript dev environment for prototyping Node.js code, with every npm package installed. Sign up to share your code.
Sign Up for Free