Я пытаюсь добавить карту swisstopo в мое угловое приложение.Я новичок в angular, и я действительно не знаю, как включить этот простой пример в мой компонент:
https://api3.geo.admin.ch/api/quickstart.html
Я пытался добавить ссылку на скрипт в свой индекс.html и он загружается, но после этого я не знаю, как и где добавить небольшой простой код JavaScript для работы.
Вставьте в angular-cli.json имя сценария javascript.я не знаю, что мне нужно сделать, чтобы выполнить этот скрипт, когда компонент загружен
MapViewComponent.ts
`import { Component, OnInit } from '@angular/core';`
@Component({
selector: 'app-map-view',
templateUrl: './map-view.component.html',
styleUrls: ['./map-view.component.scss']
})
export class MapViewComponent implements OnInit {
constructor() { }
ngOnInit() {
}
}
MapViewComponent.html
<div id="map" class="map"></div>
Быстрый запускпример из geo.admin
<!doctype html>
<html lang="en">
<head>
<style>
.map {
height: 400px;
width: 100%;
}
</style>
<title>GeoAdmin API example</title>
</head>
<body>
<h2>My first GeoAdmin map</h2>
<script src="http://api3.geo.admin.ch/loader.js?lang=en&version=4.4.2" type="text/javascript"></script>
<div id="map" class="map"></div>
<script type="text/javascript">
var layer = ga.layer.create('ch.swisstopo.pixelkarte-farbe');
var map = new ga.Map({
target: 'map',
layers: [layer],
view: new ol.View({
resolution: 500,
center: [2670000, 1160000]
})
});
</script>
</body>
</html>
Я ожидал загрузки карты при создании нового MapComponent