How to set a Marker in google-map view

Site and Services
1

Hello,
I have integrated the google-map view in a window like this: http://docs.webix.com/samples/32_thirdparty/09_google_map.html

How I can set a map marker in center of map?

Thanks,
Daniele

2

Hello,

“map” property of “google-map” view refers to google map object. So, you can useGoogleMap API:

var map = $$("mymap").map;

var marker=  new google.maps.Marker({
    map: map,
    ...
};

Please see details in google dev docs:

3

The creation of markers is described in Google developer documentation.

You will need a map object that can be accessed as $$("webix_map").map.

var myLatlng = new google.maps.LatLng(48.724, 8.215);
new google.maps.Marker({
	position: myLatlng, 
	map: $$("webix_map").map,
	title: 'Hello World!'
 });

http://webix.com/snippet/dc593c49

Also you will have to place a link to Google Maps right in the head of you document to use the API. (Now, if such link does not exist, it is included dynamically during the initialization of Webix google-map component. )

4

Just perfect!
Thanks!

5

Hello,

http://webix.com/snippet/dc593c49 this snippet doesnt work now. browser doesnt see the google object, how do i do that then ?

6

https://webix.com/snippet/35102d12 this one also gives error.

7

Google map links are automatically added to the page, so once the map is rendered, you can access the goggle object. To catch the moment when the map is ready, you should use the getMap() method with the wait parameter:

$$("webix_map").getMap(true).then(function(map){
  var myLatlng = new google.maps.LatLng(48.724, 8.215);
  var marker = new google.maps.Marker({
    position: myLatlng, 
    map: map,
    title: 'Hello World!' 
  });
});

Also, the API has changed a little bit for the previous two years. Starting from 4.2 the map can be accessed by the getMap() method only:

// wrong
$$("google-map").map
//correct
$$("google-map").getMap()

Please, check the correct code for both snippets from above:

8

@Helga Thank you so much you have saved me cheers!