Complex Map Balloons

Nov 16, 2011 at 9:13 PM

Hello,

I am trying to display a complex balloon on the map, image, statistics ect. The only asp code I got to work does not seem to allow me to add html code to the ballon.

Here is my code:

 

            <artem:GoogleMap ID="GoogleMap1" runat="server" Width="800px" Height="600px" Key="....."

                Latitude="32.02969" Longitude="-85.44661">

            </artem:GoogleMap>

 

            <artem:GoogleMarkers ID="GoogleMarkers1" runat="server"  TargetControlID="GoogleMap1">

                <Markers>

 

                </Markers>

                <MarkerOptions Draggable="true">

                </MarkerOptions>

            </artem:GoogleMarkers>

 

and the code be hide is:

 

            Artem.Google.UI.Marker marker  = new Artem.Google.UI.Marker();

            marker.Position.Latitude = 34.01969;

            marker.Position.Longitude = -84.44461;

            marker.Title = "My House";

            marker.Animation = Artem.Google.UI.MarkerAnimation.Drop;

            GoogleMarkers1.Markers.Add(marker);

==========

That all works but what I think I want is to use Google Marker instead of google.ui.marker. google.ui.marker does not seem to allow me to add info content like google marker.

but the markers1 code does not allow me to add google markers..

Like:

            GoogleMarker g = new GoogleMarker();

            HtmlGenericControl MainDiv = new HtmlGenericControl("div");

            HtmlGenericControl titleDiv = new HtmlGenericControl("div");

            titleDiv.InnerText = "This is a test";

 

            MainDiv.Controls.Add(titleDiv);

            g.InfoContent.Controls.Add(titleDiv);

            //GoogleMarkers1.Markers.Add(g);

 

==========

 

Does anybody know of a working example with version 6 of the GoogleMap Control that I can see the source code and figure this out, or know how to do what I want?

Thanks

Tom

 

 


Coordinator
Nov 17, 2011 at 6:10 AM

Hi Tom,

The InfoWindow functionality was changed in GoogleMaps API v3.
So far I only managed to implement setting a literal(string) info content of markers which to be using in InfoWindow.
You can use the new Info property of the markers to set the content for the marker's InfoWindow, instead the old Text property.
Furthermore, you can data bind now tha field too using the InfoDataField property of the GoogleMarkers extender control - check out the markers Data Bound sample in Sample Website.
The only way you can achieve your task now is to set the desired HTML as string to the Info property of Marker.

I concider to bring back the old functionality for markers' info content, like adding controls etc., but had no time to fully implement it in the version 6.0 and to check out in details the new available functionality for InfoWindow in GoogleMaps API v3.
That will be available in the next releases.

Then apologize for the lack of documentation for Google Map control v6.0.
I cannot find time to finish it these days, but it will be available once I release the final v6.0 soon, because it is crucial to have it when such a major changes are done to the control.

Regards

Feb 5, 2012 at 6:19 PM

Hi 

I am working on this control and i want to add a user control in the InfoContent that was in your previous release 

How can i use the DataInfoField for adding usercontrol as there was an example in your previous release (Calender control).

I want to add Address ,Direction, Search nearby  and street view in my Marker's baloon

I would appreciate ,if you can help me in this regard

Regards

Kanwal

Feb 22, 2013 at 8:55 AM
Hi,
there is any news for this topic ?
Is it possible now to add server side controls in the markers info window ? It seems it still accepts only a String.

Regards
Piero
Feb 24, 2013 at 5:43 PM
Hello

I solved this problem by injecting another page into marker.info. I have someting like this and it works for me
Marker marker = new Marker();
StringBuilder markerInfo = new StringBuilder();
markerInfo.AppendFormat("<iframe src='MapBubbleDetail.aspx?TripId={0}' frameborder='0' width='180px' height='220px' ></iframe>", tripDataObject.Id);
markerInfo.AppendFormat("<br /><button name='mapDetailButton' value='{0}'>{1}</button>", tripDataObject.Id, "Show Detail");
marker.Info = markerInfo.ToString();
// and some other parameters like Position, Icon, etc.
googleMap.Markers.Add(marker);
Then MapBubbleDetail.aspx is normal page which can contain whatever you want (usercontrols, images, serverside controls, another map, etc... ). After clicking on marker, this page is shown in bubble of marker