open-index/open-npm huggingface dataset:
npm package: @neshan-maps-platform/ol
Description: Neshan Platform SDK integrated with Openlayers
Author: Neshan Maps Platform
Latest version: 1.0.5

# Neshan OpenLayers

Neshan Platform SDK integrated with Openlayers.

## Getting Started

- create an account and generate an API-KEY for web sdk: [Neshan Platform Website](https://platform.neshan.org/)

- add js/css
    - without bundler

      ol object will be available in window

      ```html
      <!-- better to be added into head -->
      <link rel="stylesheet" href="https://static.neshan.org/sdk/openlayers/v8.1.0/neshan-sdk/v1.0.5/index.css" />
  
      <!-- make sure this script is loaded before initializing map (using defer, onload event, etc) -->
      <script src="https://static.neshan.org/sdk/openlayers/v8.1.0/neshan-sdk/v1.0.5/index.js"></script>
      ```

    - using bundlers (webpack, rollup)
      ```shell
      // using npm
      npm i @neshan-maps-platform/ol
      
      // using yarn
      yarn add @neshan-maps-platform/ol
      ```

- add map wrapper element
  ```html
  <div id="map"></div>
  ```

- define proper width/height for your wrapper
  ```css
  body {
      height: 100vh;
      width: 100vw;
      margin: 0;
  }
  
  #map {
      height: 100%;
      width: 100%;
  }
  ```

- initialize Map
  - node environment
    ```js
    import '@neshan-maps-platform/ol/ol.css';
    import Map from '@neshan-maps-platform/ol/Map';
    import View from '@neshan-maps-platform/ol/View';
    import {fromLonLat} from '@neshan-maps-platform/ol/proj';
  
    new Map({
        mapType: 'neshan',
        target: 'map',
        key: 'YOUR-API-KEY',
        poi: true,
        traffic: true,
        view: new View({
            center: fromLonLat([51.389, 35.6892]),
            zoom: 14
        })
    });
    ```
  - window
    ```js
    var map = new ol.Map({
        mapType: 'neshan',
        target: 'map',
        key: 'YOUR-API-KEY',
        poi: true,
        traffic: true,
        view: new ol.View({
            center: ol.proj.fromLonLat([51.389, 35.6892]),
            zoom: 14
        })
    });
    ```
See the following examples for more detail on bundling OpenLayers with your application:

 * Using [Rollup](https://github.com/openlayers/ol-rollup)
 * Using [webpack](https://github.com/openlayers/ol-webpack)
 * Using [Parcel](https://github.com/openlayers/ol-parcel)

## TypeScript support

The [ol package](https://npmjs.com/package/ol) includes auto-generated TypeScript declarations as `*.d.ts` files.