角2單張地圖

我遇到了麻煩單張地圖的角度2.在記事本的工作，我已經寫了下面的代碼來創建一個簡單的地圖：角2單張地圖

<head> 
    <title>Experiment maps</title> 
    <link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css" /> 
    <script src="https://unpkg.com/[email protected]/dist/leaflet.js"></script> 
</head> 
<body> 

<div id="map" style="height: 400px; background: #919191;"></div> 

<script> 
    var map = L.map('map').setView([54.5833300, -5.9333300], 13); 

    L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', 
     { 
     attribution: 'Tiles by <a href="http://mapc.org">MAPC</a>, Data by <a 

href="http://mass.gov/mgis">MassGIS</a>', 
     maxZoom: 17, 
     minZoom: 9 
     }).addTo(map); 
</script> 

<h1>map</h1> 

</body>

我已經進口的相同樣式表和腳本到angular.html文件中，但是，當我加載組件時，我只是得到一個帶有紅色背景的400px的div佔位符，沒有任何形狀或形式的映射。我是否錯誤地引用傳單的css和腳本文件？

我也嘗試將styleUrls: ['https://unpkg.com/[email protected]/dist/leaflet.css']添加到角度組件本身，但沒有成功。

此外，可你在引用的index.html 2個樣式表，用相對=「樣式表」，像這樣：

<link rel="stylesheet" href="styles.css"> 
<link rel="stylesheet" href="https://unpkg.com/[email protected] rc.3/dist/leaflet.css" />

我試圖刪除我原來的style.css，只是留下leftlet的版本。

感謝

來源

2016-09-15 taxer03

這是不可能使用單張一個組件內這樣的「常規」方式。您必須使用npm將其加載到您的項目中（例如（npm install leaflet））。

這裏是如何融入你的角2的應用提供了很好的教程： https://www.npmjs.com/package/@asymmetrik/angular2-leaflet

來源

2017-04-25 13:29:04 Bunnynut

我打字稿（角2）制定的，我使用的JavaScript的官方文檔傳單。

你只需要安裝這一行的傳單目錄： npm install leaflet。

，並添加安裝後此導入你的進口：

import L from "leaflet";

終於可以使用單張一樣在leaflet docs所示。（有小的變化看谷歌）

祝你好運。

來源

2017-07-11 21:52:27

import * as'L'from'leaflet';在新的語法中 –

回答

相關問題