Ich habe versucht, die Anweisungen here durchzugehen, und ich sehe keine Karte, wenn ich Meteor laufen lasse.Wie kann ich Meteor-Flugblatt verwenden, um Flugblatt und Meteor zu integrieren?
Hier sind alle Schritte, die ich nehmen:
meteor create map-project
cd map-project
meteor add bevanhunt:leaflet
dann ändere ich den Inhalt des Client/main.html zu:
<head>
<title>map-project</title>
</head>
<body>
<div id="map"></div>
<h1>Welcome to Meteor!</h1>
{{> hello}}
{{> info}}
</body>
<template name="hello">
<button>Click Me</button>
<p>You've pressed the button {{counter}} times.</p>
</template>
<template name="info">
<h2>Learn Meteor!</h2>
<ul>
<li><a href="https://www.meteor.com/try" target="_blank">Do the Tutorial</a></li>
<li><a href="http://guide.meteor.com" target="_blank">Follow the Guide</a></li>
<li><a href="https://docs.meteor.com" target="_blank">Read the Docs</a></li>
<li><a href="https://forums.meteor.com" target="_blank">Discussions</a></li>
</ul>
</template>
und der Inhalt von Client/main.css zu:
#map {
min-height: 350px;
min-width: 100%;
}
und schließlich der Inhalt des Client/main.js zu:
import { Template } from 'meteor/templating';
import { ReactiveVar } from 'meteor/reactive-var';
import './main.html';
Template.hello.onCreated(function helloOnCreated() {
// counter starts at 0
this.counter = new ReactiveVar(0);
});
Template.hello.helpers({
counter() {
return Template.instance().counter.get();
},
});
Template.hello.events({
'click button'(event, instance) {
// increment the counter when button is clicked
instance.counter.set(instance.counter.get() + 1);
},
});
if (Meteor.isClient) {
L.Icon.Default.imagePath = 'packages/bevanhunt_leaflet/images/';
var map = L.map('map');
}
if (Meteor.isClient) {
L.tileLayer.provider('Thunderforest.Outdoors').addTo(map);
}
Dann mache ich:
meteor npm install
meteor
dann auf die gehostete URL navigieren, und es gibt keine Karte zu sehen.
Hat jemand erfolgreich dies getan wer kann helfen? Vielen Dank.
Ich habe 'if (Meteor.isClient) { L.Icon.Default.imagePath = 'packages/bevanhunt_leaflet/images /' hinzugefügt; var map = L.map ('Karte'); } zu meinem obigen main.js-Skript und die Karte wird immer noch nicht angezeigt –