1.0.2 • Published 4 years ago
ng-mapy-cz v1.0.2
NgMapyCz
An unofficially integration of MapyCZ API for Angular2+ Framework
Code scaffolding
Run npm install ng-mapy-cz --save
to install this package
In index.html add to section this two lines
<!doctype html>
<html lang="en">
<head>
----
<script src="https://api.mapy.cz/loader.js"></script>
<script>Loader.load()</script>
----
</head>
Import this module
import {NgModule} from "@angular/core";
import {MapyCzModule} from "ng-mapy-cz";
@NgModule({
declarations: [
],
imports: [MapyCzModule],
exports: []
})
export class YourModule {}
Create new map:
a) In your component add configuration for your map (example at https://api.mapy.cz/view?page=instruction)
import {Component, OnInit} from '@angular/core';
@Component({
selector: 'app-my-component',
templateUrl: './my.component.html'
})
export class MyComponent implements OnInit {
mapConfiguration = `<script type="text/javascript">
var stred = SMap.Coords.fromWGS84(14.41, 50.08);
var mapa = new SMap(JAK.gel("my-map-id"), stred, 10);
mapa.addDefaultLayer(SMap.DEF_BASE).enable();
mapa.addDefaultControls();
</script>`;
constructor() { }
ngOnInit() {
}
}
b) In your template:
<mapy-cz [script]="mapConfiguration">
<div id="moje-mapa" class="my-map-id" style="width:600px; height:400px;">
</div>
</mapy-cz>
You can put anything inside tag, but you have to use the same ID as in mapConfiguration variable
c) Enjoy mapy-cz in your Angular Apps :)