Reimers.dk

.NET, AJAX and Google APIs brought together
Welcome to Reimers.dk Sign in | Join | Help
in Search

Using the ELabel extension with Reimers MAP ?

Last post 03-13-2010, 18:55 by DrGPS. 3 replies.
Sort Posts: Previous Next
  •  03-02-2010, 20:11 3043

    Using the ELabel extension with Reimers MAP ?

    ELabel allows you to place text labels or images or any other HTML elements on the map and have them move with the map, like marker and polyline overlays. Anyone that can help me how to implement this 

    javascript and how to access it from codebehind in vb.net so that I can put ordinary markers on the map with small label that gives a hint what's in the infowindow details shown when clicking the marker.

    Good example of what I am trying to achieve here http://econym.org.uk/gmap/example_elabel.htm 

    Read more here

    http://econym.org.uk/gmap/elabel.htm

     

     

    And what's is

    myMarker.MarkerText = "how does it work ?"  Can anybody explain.. Is this a visible label when the ballon is down ? 

    Best regards

    Johan  

  •  03-06-2010, 17:59 3052 in reply to 3043

    Re: Using the ELabel extension with Reimers MAP ?

    DrGPS:

    ELabel allows you to place text labels or images or any other HTML elements on the map and have them move with the map, like marker and polyline overlays. Anyone that can help me how to implement this 

    javascript and how to access it from codebehind in vb.net so that I can put ordinary markers on the map with small label that gives a hint what's in the infowindow details shown when clicking the marker.

    Good example of what I am trying to achieve here http://econym.org.uk/gmap/example_elabel.htm 

    Read more here

    http://econym.org.uk/gmap/elabel.htm

     

     

    And what's is

    myMarker.MarkerText = "how does it work ?"  Can anybody explain.. Is this a visible label when the ballon is down ? 

    Best regards

    Johan  

     

    Anyone brave enough to come with some suggestions that point me in the right direction ?  I thin this is a essential function to be able to put a label beside each marker !  

  •  03-12-2010, 21:28 3059 in reply to 3052

    Re: Using the ELabel extension with Reimers MAP ?

    Then we are two sorry bastards ! I am looking for this " how-to " tutorial / code too. If you find any good answers let me know

    /

    Best regards 

    JUNK !  

  •  03-13-2010, 18:55 3060 in reply to 3043

    Re: Using the ELabel extension with Reimers MAP ?

    I have trid this , but I can't find whats wrong, any ideas ?
     
    ------------------------------------ 
     ELabel allows you to place text labels or images or any other HTML elements on the map and have them move with the map, like marker and polyline overlays. Anyone that can help me how to implement this 

    javascript and how to access it from codebehind in vb.net so that I can put ordinary markers on the map with small label that gives a hint what's in the infowindow details shown when clicking the marker.

    Good example of what I am trying to achieve here http://econym.org.uk/gmap/example_elabel.htm 

    Read more here

    http://econym.org.uk/gmap/elabel.htm

     
     ASPX
    ------------------------------------ 
     
    <%@ Page Language="VB" AutoEventWireup="true" CodeFile="default.aspx.vb" Inherits="map" %>

    <%@ register assembly="GoogleMap" namespace="Reimers.Map" tagprefix="Reimers" %>
    <%@ Register assembly="GoogleMap" namespace="Reimers.Map.CustomMaps" tagprefix="cc1" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head id="Head1" runat="server">
    <title>GMap-utility example</title>
       <style type="text/css">
       
        .style1 {background-color:#ffffff;font-weight:bold;border:2px #006699 solid;}
        .style2 {background-color:#ffcccc;}
     
        </style>
         <script src="elabel.js" type="text/javascript"></script>
    </head>
    <body>
    <form id="form1" runat="server">
    <div>
    <Reimers:GoogleMap OnMapLoaded="mapLoad_ServerEvent" AjaxScriptLoading="False" ID="GMap" Height="680" width="760" runat="server" GoogleKey="Your Map Key" />
    </div>
    </form>
    </body>
    </html>
     
     
     
    VB.net
    ____________________________________________________________________________ 
     
     
    imports System
    Imports System.Collections
    Imports System.Configuration
    Imports System.Data
    Imports System.Linq
    Imports System.Web
    Imports System.Web.Security
    Imports System.Web.UI
    Imports System.Web.UI.HtmlControls
    Imports System.Web.UI.WebControls.WebParts
    Imports System.Xml.Linq
    Imports Reimers.Map
    Imports System.Text
    Imports Reimers.WebControls.UI

    Partial Public Class map
        Inherits System.Web.UI.Page
        Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)
            If Not IsPostBack Then
                'set map defaults
                GMap.ClearOverlays()
                GMap.Zoom = 10
                Dim initialPoint As New GoogleLatLng(58.420714, 14.401875)
                GMap.Center = initialPoint
            End If
            'Need to register the extinfowindow.js file so the map can access the methods
            Dim form As HtmlForm = Page.Form
            Dim javascript As New HtmlGenericControl()
            javascript.TagName = "script"
            javascript.Attributes.Add("type", "text/javascript")
            javascript.Attributes.Add("src", "elabel.js")
            form.Controls.Add(javascript)
        End Sub

        
        Protected Sub mapLoad_ServerEvent(ByVal sender As Object, ByVal e As Reimers.Map.BoundsEventArgs)
            'call our method which creates an array of longitude and latitudes
            'This array is completely arbitrary, you could be using a stored procedure to return these values from a database or wherever.
            Dim arr As String(,) = returnArray()
            'Ok, we have an array of results so let build these up into some javascript commands that we want to send to the map
            'Using a string builder as many examples use a standard string which needs to be instantiated each time it is appended to.
            Dim javascript_SentBackToMap As New StringBuilder()
            'looping through the array of longitude and latitudes we have created
            Dim utopia As String
            Dim style2 As Style

          
            Dim i As Integer = 0
            While i <= arr.GetUpperBound(0) - 1

                'var label = new ELabel(new GLatLng(44.3,-78.8), "Utopia", "style1");

                javascript_SentBackToMap.Append("var marker" + i.ToString() + " = new GMarker(new GLatLng(" + arr(i, 0) + "," + arr(i, 1) + "));")
                javascript_SentBackToMap.AppendLine("new ELabel(new GLatLng(" + arr(i, 0) + "," + arr(i, 1) + "), utopia ,style2 " & ");")
                javascript_SentBackToMap.Append("reimers.map." + GMap.ID + ".addOverlay(marker" + i.ToString() + ");")
                System.Math.Max(System.Threading.Interlocked.Increment(i), i - 1)
            End While

            e.MapCommand = e.Map.ClearOverlays() + javascript_SentBackToMap.ToString()
        End Sub
        
        Protected Function returnArray() As String(,)

            'declare and init 2-dimensional array
            Dim arr As String(,) = New String(1, 2) {}
            'fill our array with some dummy longitude and latitudes
            arr(0, 0) = "58.420714"
            arr(0, 1) = "14.401875"
            Return arr
        End Function

    End Class
View as RSS news feed in XML