在线时间:8:00-16:00
迪恩网络APP
随时随地掌握行业动态
扫描二维码
关注迪恩网络微信公众号
开源软件名称(OpenSource Name):dburles/meteor-google-maps开源软件地址(OpenSource Url):https://github.com/dburles/meteor-google-maps开源编程语言(OpenSource Language):JavaScript 97.4%开源软件介绍(OpenSource Introduction):Meteor Google MapsLatest version of the Google Maps Javascript API with an interface designed for Meteor.
Table of ContentsNoteThe maps API is client-side only. Server side support may be added soon. Installation$ meteor add dburles:google-maps Alternatively if you wish to add the package from within another package and have ExamplesHow to create a reactive Google map Demo project for the examples below Usage OverviewCall the if (Meteor.isClient) {
Meteor.startup(function() {
GoogleMaps.load();
});
} If you prefer to load the maps API only once it's required, you may do so from within a Template Template.contact.onRendered(function() {
GoogleMaps.load();
}); Wrap the map template to set the width and height. <body>
<div class="map-container">
{{> googleMap name="exampleMap" options=exampleMapOptions}}
</div>
</body> .map-container {
width: 800px;
max-width: 100%;
height: 500px;
} Pass through the map initialization options by creating a template helper. This will only run once. Template.body.helpers({
exampleMapOptions: function() {
// Make sure the maps API has loaded
if (GoogleMaps.loaded()) {
// Map initialization options
return {
center: new google.maps.LatLng(-37.8136, 144.9631),
zoom: 8
};
}
}
}); Place the Template.body.onCreated(function() {
// We can use the `ready` callback to interact with the map API once the map is ready.
GoogleMaps.ready('exampleMap', function(map) {
// Add a marker to the map once it's ready
var marker = new google.maps.Marker({
position: map.options.center,
map: map.instance
});
});
}); Access a map instance any time by using the GoogleMaps.maps.exampleMap.instance APIBlaze Template
create
An alternative to using the Options:
Example: GoogleMaps.create({
name: 'exampleMap',
element: document.getElementById('exampleMap'),
options: {
center: new google.maps.LatLng(-37.8136, 144.9631),
zoom: 8
}
}); load
Loads the map API. Options passed in are automatically appended to the maps url.
By default Example: GoogleMaps.load({ v: '3', key: '12345', libraries: 'geometry,places' }); loadUtilityLibrary
A method to ease loading external utility libraries. These libraries will load once the Google Maps API has initialized. loaded
Reactive method which returns ready
Runs once the specified map has rendered.
Example: GoogleMaps.ready('exampleMap', function(map) {
// map.instance, map.options
}); The callback function returns an object containing two properties:
You can also access this object directly by name: GoogleMaps.maps.exampleMap initialize
This function is passed into the Google maps URL as the callback parameter when calling Mobile platformsIf you're targeting mobile platforms you'll need to configure the following access rules in App.accessRule('*.google.com/*');
App.accessRule('*.googleapis.com/*');
App.accessRule('*.gstatic.com/*'); For more refer to the official documentation. LicenseMIT |
2023-10-27
2022-08-15
2022-08-17
2022-09-23
2022-08-13
请发表评论