dburles/meteor-google-maps

Meteor package for the Google Maps Javascript API v3

openqubit

@openqubit

@dburles You are right. I got rid of all the other lines and still works. Thanks.

Jan Dočekal

@jdckl

Anybody here who has experience with the marker clusterer?

I can't seem to be able to get it working

adamgins

@adamgins

Thanks.

Yep. Been working that way in my production systems, but struggling to get it it working with 1.4.2 beta

any ideas welcomo

openqubit

@openqubit

@violetzie Here is an example http://en.proft.me/2016/06/2/how-create-google-map-marker-cluster-meteorjs/ that uses this package https://github.com/oakworks/meteor-marker-clusterer and to cluster i guess you do this

GoogleMaps.ready 'myMap', (map) ->
    markers = []
    markerCluster = new MarkerClusterer(map.instance, markers, clusterOptions)

adamgins

@adamgins

@openqubit have you managed to get it working with Xcode8/Cordova. Mine has worked with Xcode 7.

openqubit

@openqubit

@adamgins Yes it has.

adamgins

@adamgins

@openqubit do you have a CSP / BrowserPolicy beyond the App.accessRule examples above, please? I just get a black screen where the iframe is (can't see an error on the console).

openqubit

@openqubit

@adamgins No,i am not using anything beyond what i have above. I think its a problem with your cordova or xcode. I had a hell of a time setting up the sdk's on Xcode (8.0 and 7.3.1 for OS X El Capitan

adamgins

@adamgins

@openqubit thanks. The weird thing is other iFrames (like Youtube) work fine... it's just that maps don't show on Cordova, so seems like something in the security/policy, any thoughts welcome

adamgins

@adamgins

@dburles thanks again for the package... I logged a bit more info here dburles/meteor-google-maps#129 I can't seem to see any other error messages on Cordova, like not being able to access something ... any thoughts welcome

adamgins

@adamgins

OK, I think I know what's happening my `Meteor.startup(function() {

GoogleMaps.load({ key: '<my key>', libraries: 'places'});

});` is not running. If I run it manually through Safari console, the map shows up.
I thought Meteor.startup should only run once Cordova is ready... thoughts?

adamgins

@adamgins

If I move the GoogleMaps.load to the onRendered it works. ..not sure why iOS 10 does not run the startup first?

David Burles

@dburles

@adamgins interesting, I would recommend placing it on an onRendered callback to begin with as startup is really just for examples

that means you can lazy load the api once it's required

adamgins

@adamgins

@dburles thanks.

openqubit

@openqubit

@adamgins Mine turned out to be a CORS issue so you should also look there.

Jan Dočekal

@jdckl

Another question, I got clusterer working (thx @openqubit ), now I would like to get geolocation marker working, has anyone used that ? (its a separate library, thats supposed to show the users location with a little circle) I have it running but I am getting "geomarker.js:9 - Uncaught ReferenceError: google is not defined", which is weird..

openqubit

@openqubit

@violetzie You're welcome. Check if you have the maps loaded if

(Meteor.isClient) {
  Meteor.startup(function(){ 
    GoogleMaps.load({
    key: 'your key'
    });
  });
  }

Jan Dočekal

@jdckl

Yea I do have that, I tried moving it to public and using GoogleMaps.loadUtilityLibrary but that resulted in "GeolocationMarker undefined".. so I gave up and created the market the normal way lol

Jan Dočekal

@jdckl

I am struggling with the directions library right now though, seems like nothing is working either

const directionsService = new GoogleMaps.DirectionsService();
const directionsDisplay = new GoogleMaps.DirectionsRenderer();

function createRoute(start, end) {
directionsService.route({
  origin: start,
  destination: end,
  travelMode: google.maps.DirectionsTravelMode.DRIVING
}, function(response, status) {
  if (status == google.maps.DirectionsStatus.OK) {
    directionsDisplay.setDirections(response);
  } else {
      console.log('Nepovedlo se: ' + status);
    }
});

}

I do have the library on load

GoogleMaps.load({
key: Meteor.settings.public.Googlemaps.gmaps,
libraries: 'directions, geometry'
});

the map actually stopped loading

Jan Dočekal

@jdckl

got that to work but now it says "GoogleMaps.DirectionsService is not a constructor" :D

LelandB

@LelandB

Hello, new face here. Does anyone know how to best use Iron Router with this package? I'm trying to split up my directories into a typical Meteor app (with client/ lib/ server/ and public/) but if I hook up a map template html page via {{yield}} my app breaks. Any suggestions?

David Burles

@dburles

@violetzie should be new google.maps.DirectionsService(); and new google.maps.DirectionsRenderer(); also you'll want to create those once the map has loaded (most likely within GoogleMaps.ready(...)

David Burles

@dburles

@LelandB if possible, I'd recommend using flow router instead as iron router is no longer maintained. here's an example you can check out https://github.com/dburles/map-bug-58 for a working example

openqubit

@openqubit

This message was deleted

openqubit

@openqubit

How can i go to specific point on the map onClick?.

LelandB

@LelandB

@dburles I didn't know iron router was no longer maintained but I figured out my problem. Thanks for the heads up tho! As I'm working through my project I found this: dburles/meteor-google-maps#50. Is that solution still feasible?

openqubit

@openqubit

I finally figured it out ;)

openqubit

@openqubit

I am using the reactive maps example in an app but i cant seem to close any infowindow on marker click. More details here dburles/reactive-maps-example#2

Marcel Morales

@MarcelRama_twitter

Hello, someone around here who can help me with the maps?

Daniel Delgadillo

@diegovsdaniel

drawing manager google maps event not work

please help me :(

Aboobakkar

@aboobakkar

hi guys , i have tried github dbrules sample :meteor-google-maps-react-example

but this sample inbuilt in my react meteor project routing to this page first time show correctly and then loading only ?

davidsavoie1

@davidsavoie1

Morning! I searched a lot on the Web for a solution but still need help. I have a map on which I show markers from a Meteor collection and a list on the left with the same collection items. I can click these markers to show an infoWindow and the corresponding list item on the left gets selected (Session variable).

I'm trying to get the reverse effect also, ie get the appropriate marker 'click' event to fire when I select an element in my list. However, when I handle the list item 'click' event, I'm outside of the GoogleMaps.ready scope where my markers array is defined. Can anyone point me in the right direction please?

Hakan

@hakanmhmd

Hello, can someone help with the clusterization. What exactly do I need to change? I tried everything said before but nothing worked.

David Burles

@dburles

@/all who's using the package with React?

Kane

@paradigmist

Me @dburles

Refi Ridho S.

@refiridho

Hello all friend ... I can Ask about tracking with marker ...
i create app driver n user ...
when app driver switch on in user app showing marker driver and user can tracking driver ride..
but...
when app driver phone locked,, marker driver stay and stopped not running ...
how solved this problem ??
can i help me...
thanks..

Punita Ojha

@punitaojha

This message was deleted

Pablo Ariel Bilevich Alaniz

@pablobvch

Hello Everyone, good morning! I need your help. I would like to be able to compare a city stored in my database with other got from google maps. I know I can compare two countries through IsoCode but how can compare two cities? Do I Have to do it by name? Thanks in advance.

Marcelovv2

@Marcelovv2

Hi, I have a map with multiple custom markers for different points of sale, the markers also have an infowindow which I would like to style, anyone help?

Sarah Mattar

@sarahmattar

Hey @dburles! I'm following your example for the reactive maps. I'm in the process of creating my own map based web application in Meteor as well so I'm using yours as a guide to, at the very least, just initialize the map. When I follow your code for initializing the map in my app, I get an error in the console telling me I need an API Key from Google Maps. Okay, fine, got my API key from Google Maps... but after putting it in, the map is still not initializing on my web application.

From there I started comparing notes and looking through the Github forums on the reactive maps example. There didn't seem to be any spot in yours that you'd put an API Key in... so

Meteor.startup(function(){
GoogleMaps.load();
});

Seemed to work find in yours. In mine, after poking through Github, I have it set as

Meteor.startup(function(){
GoogleMaps.load({v: "3", key: "allthelettersandnumbersofmyAPIkey_here", libraries: "geometry, places"})
});

Syntactically, shouldn't this be correct? I still have a blank page where my map should be though.

I've downloaded your copy of the application from GitHub and when I fire it up, it runs fine. I'm creating my application in Meteor 1.6 and I think your reactive map example is done in Meteor 1.2 -
so now I'm wondering if this is a meteor compatibility issue, or a Google Maps API issue (or both)?

Where communities thrive

People

Repo info

Activity