sleipner-map-ye

This is a Map component of React

Usage no npm install needed!

<script type="module">
  import sleipnerMapYe from 'https://cdn.skypack.dev/sleipner-map-ye';
</script>

README

@sleipner/sleipner-map

Map Component of React

Publish the Map Component to NPM Repository @sleipner

$ cd PROJECT_FOLDER
$ npm run build
$ npm publish

Tip: make sure the component is not published yet, otherwise it must be unpublished, so that it can be republished. User who publishes the component must be a member from organization '@sleipner' and log in first. npm unpublish @sleipner/sleipner-map -f

Installation

$ npm install @sleipner/sleipner-map

Tip: make sure that you have already logged in NPM and must be a member of '@sleipner' or the private package can't be installed.

Usage

import Map from '@sleipner/sleipner-map';
                
<Map width={100}
     height={200}
     vessels={vessels} 
     mapStyle={style}
     hasNavigationCtrl={false}
     subComponents={subComponents} 
/>

width, height, longitude, latitude, zoom can be passed to Map component as properties, or they will have a default value. Property vessel receives an array which contains GeoJSON features of vessels. Property mapStyle receives a style from outsides, e.g.:

import ms1 from './mda-map-style.json';
import {fromJS} from 'immutable';
const style = fromJS(ms1);

Property hasNavigationCtrl receives an boolean which indicates whether a navigation control will be created on the map. By default, this flag is true

Property subComponents receives an array which contains subcomponents,e.g. :

const headerComponent = (<div>header</div>);
const basePanelComponent = (<BasePanel>basePanel</BasePanel>);
const subComponents = [headerComponent, basePanelComponent];