Hello All.
I am using the GoogleMaps extension to show a route on a map. The AddRoute() shows the route but it has a pin with ‘A’ at the start and a pin with ‘B’ on it at the end. I would like to replace those pins with my own icons. I can use AddMarker() to add my own markers but I can’t get rid of the default ‘A’ and ‘B’ pins. From some non-wisej websites I have found out that there is a ‘suppressMarkers’ option in a DirectionsRenderer object that should stop the default pins appearing. But I can’t work out how to set this option when using the GoogleMaps extension in WiseJ.
Using the Javascript from one of the other websites I am trying to do something like this (in a button event handler):
this.Eval(@”
var mapOptions = {
zoom: 15,
};
map = new google.maps.Map(document.getElementById(‘App.” + this.Name + @”.googleMap1’), mapOptions);
var directionsRenderer = new google.maps.DirectionsRenderer({
suppressMarkers: true
});
directionsRenderer.setMap(map);”);
But I get a ‘Map: Expected mapDiv of type HTMLElement but was passed null’ error message. I don’t know what to pass in to the getElementById call to make this work. Can anyone familiar with Javascript and Wisej help me here please ? In C# my google map control is called googleMap1.
Or maybe I am on the wrong tack trying to do this via Javascript – is there a way of suppressing the default route icons straight from C# ?
Thank you
Andrew
You are on the right track with using JavaScript and with the ‘suppressMarkers’ option in a DirectionsRenderer object.
Some things to fix with your code:
– Don’t use getElementbyId. There are better ways to get the reference to the Wisej GoogleMaps widget.
Also, you are creating a new map here: map = new google.maps.Map(...
You don’t need to create a new map, we can just access the map that already exists within the widget.
– You do this.Eval(...
In your code, this
is equal to NameSpaceName.Page1. (NameSpaceName depends on what you named your project- it’s probably something like WisejWebApplication1 So, this
would be WisejWebApplication1.Page1
). Instead of calling Eval from the Page, call it from the googleMap object- which in your case is googleMap1
So your code should look like: googleMap1.Eval(...
Now we can access properties inside of the widget- such as the DirectionsRenderer object that already exists inside of the widget. Very handy!
Here is the code snippet you need: (Note: Inside of the Eval statement here, this
refers to the widget container, this.map
refers to the map inside of the widget.)
googleMap1.Eval("this._directionsRenderer = new google.maps.DirectionsRenderer({suppressMarkers: true}); this._directionsRenderer.setMap(this.map); ");
I’ve attached a sample as well. You will need to add your Google Maps API Key in the designer to get it to work.
-Julie
Just a quick note that Wisej.NET 3.2.6 was released today.
Best regards
Frank
Hi Andrew,
We are going to add a new SuppressMarkers property as an enhancement, and we also fixed the issue you had when clearing and re-adding routes!
This will be part of the next Wisej.NET 3.2.6 release!
Best,
Alaa
Please login first to submit.