Security News
JavaScript Leaders Demand Oracle Release the JavaScript Trademark
In an open letter, JavaScript community leaders urge Oracle to give up the JavaScript trademark, arguing that it has been effectively abandoned through nonuse.
@dlr-eoc/map-tools
Advanced tools
This module contains UI components like mouse-position, map-navigator and projection-switch for @dlr-eoc/map-ol.
This repository contains 3 ui components:
<ukis-mouse-position></ukis-mouse-position>
<ukis-projection-switch [mapSvc]="mapSvc" [projectionList]="projections"></ukis-projection-switch>
<ukis-map-navigator [mapState]="mapStateSvc"></ukis-map-navigator>
For examples see demo maps route-example-events
import { MapOlModule } from '@dlr-eoc/map-ol';
import { MapToolsModule } from '@dlr-eoc/map-tools';
...
imports: [
...
MapOlModule,
MapToolsModule
]
##Create simple map:
<main class="content-area">
<ukis-map-ol [layersSvc]="layersSvc" [mapState]="mapStateSvc" [controls]="controls" id="olMap"></ukis-map-ol>
</main>
import { LayersService } from '@dlr-eoc/services-layers';
import { MapStateService } from '@dlr-eoc/services-map-state';
import { IMapControls } from '@dlr-eoc/map-ol';
import { osm, eoc_litemap } from '@dlr-eoc/base-layers-raster';
controls: IMapControls;
constructor(
public layerSvc: LayersService,
public mapStateSvc: MapStateService
) { }
ngOnInit() {
this.addBaselayers();
}
addBaselayers() {
const layers = [
new osm({
visible: false,
legendImg: null
}),
new eoc_litemap({
visible: true,
legendImg: null
})
];
layers.map(l => this.layerSvc.addLayer(l, 'Baselayers'));
}
##To add mouse position component:
<clr-vertical-nav [clrVerticalNavCollapsible]="true" [clr-nav-level]="2">
<clr-vertical-nav-group [clrVerticalNavGroupExpanded]="false" class="layers" title="Coordinates">
<cds-icon shape="compass" clrVerticalNavIcon></cds-icon>
Coordinates
<clr-vertical-nav-group-children class="padding title-ellipsis">
<ukis-mouse-position></ukis-mouse-position>
</clr-vertical-nav-group-children>
</clr-vertical-nav-group>
</clr-vertical-nav>
##To add projection switch component (with 3 predefined projections):
<clr-vertical-nav-group [clrVerticalNavGroupExpanded]="false" class="layers" title="Projection">
<cds-icon shape="map" clrVerticalNavIcon></cds-icon>
Projection
<clr-vertical-nav-group-children class="padding title-ellipsis">
<ukis-projection-switch [mapSvc]="mapSvc" [projectionList]="projections" [fitViewToNewExtent]="true" [mapStateSvc]="mapStateSvc"></ukis-projection-switch>
</clr-vertical-nav-group-children>
</clr-vertical-nav-group>
import { IProjDef } from '@dlr-eoc/map-tools'
projections: IProjDef[];
constructor(
public layerSvc: LayersService,
public mapStateSvc: MapStateService
) {
const arcticPolarStereographic: IProjDef = {
code: 'EPSG:3995',
proj4js: '+proj=stere +lat_0=90 +lat_ts=71 +lon_0=0 +x_0=0 +y_0=0 +datum=WGS84 +units=m +no_defs +type=crs',
title: 'Arctic Polar Stereographic',
extent: [-3299207.53, -3333134.03, 3299207.53, 3333134.03],
worldExtent: [-180.0, 60.0, 180.0, 90.0],
global: true,
units: 'm'
};
const antarcticPolarStereographic: IProjDef = {
code: `EPSG:3031`,
proj4js: '+proj=stere +lat_0=-90 +lat_ts=-71 +lon_0=0 +x_0=0 +y_0=0 +datum=WGS84 +units=m +no_defs +type=crs',
title: 'Antarctic Polar Stereographic',
extent: [-3299207.53, -3333134.03, 3299207.53, 3333134.03],
worldExtent: [-180.0, -90.0, 180.0, -60.0],
global: true,
units: 'm'
};
const webMercator: IProjDef = {
code: `EPSG:3857`,
proj4js: '+proj=merc +a=6378137 +b=6378137 +lat_ts=0 +lon_0=0 +x_0=0 +y_0=0 +k=1 +units=m +nadgrids=@null +wktext +no_defs +type=crs',
title: 'Spherical Mercator',
extent: [-20037508.34, -20048966.1, 20037508.34, 20048966.1],
worldExtent: [-180.0, -85.06, 180.0, 85.06],
global: true,
units: 'm'
};
this.projections=[webMercator, arcticPolarStereographic, antarcticPolarStereographic];
}
##To add navigator component:
<clr-vertical-nav-group [clrVerticalNavGroupExpanded]="true" class="layers" title="Navigator">
<cds-icon shape="compass" clrVerticalNavIcon></cds-icon>
Navigator
<clr-vertical-nav-group-children class="padding title-ellipsis">
<ukis-map-navigator [mapState]="mapStateSvc"></ukis-map-navigator>
</clr-vertical-nav-group-children>
</clr-vertical-nav-group>
===
This library was generated with Angular CLI version 8.2.14.
Run ng generate component component-name --project map-tools
to generate a new component. You can also use ng generate directive|pipe|service|class|guard|interface|enum|module --project map-tools
.
Note: Don't forget to add
--project map-tools
or else it will be added to the default project in yourangular.json
file.
Run ng build map-tools
to build the project. The build artifacts will be stored in the dist/
directory.
Run ng test map-tools
to execute the unit tests via Karma.
To get more help on the Angular CLI use ng help
or go check out the Angular CLI README.
FAQs
This module contains UI components like mouse-position, map-navigator and projection-switch for @dlr-eoc/map-ol.
The npm package @dlr-eoc/map-tools receives a total of 12 weekly downloads. As such, @dlr-eoc/map-tools popularity was classified as not popular.
We found that @dlr-eoc/map-tools demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 0 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
In an open letter, JavaScript community leaders urge Oracle to give up the JavaScript trademark, arguing that it has been effectively abandoned through nonuse.
Security News
The initial version of the Socket Python SDK is now on PyPI, enabling developers to more easily interact with the Socket REST API in Python projects.
Security News
Floating dependency ranges in npm can introduce instability and security risks into your project by allowing unverified or incompatible versions to be installed automatically, leading to unpredictable behavior and potential conflicts.