8 Replies Latest reply on Dec 26, 2013 4:18 AM by haarbol

    Give markers in google maps the name of a field

    haarbol

      Hi all,

       

      I've made some simple Filemaker databases in the past, but i've never worked with the webviewer and Google Maps before.

      I have tried using Google to answer this question, but i haven't found a good answer yet, so i hope you can help me.

       

      There is a database going around from a summit last year (by THomas Kunetz - http://www.filemaker.com/images/devrel/video/INT005_DevCon_2012.mp4)

      that shows how to generate a HTML file that places multiple markers from your database automatically in a Google Map, which you can then display

      through the webviewer.

       

      What i want to do is to give those markers the name of a specific field in my database, but so far i've only managed to make the
      marker that is first placed display the currently selected record, and the rest nothing.

       

      The database i've used as a starting point is using this HTML code:

      <!DOCTYPE html>

      <html>

      <head>

      <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />

      <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>

      <title>Google Maps Test</title>

      <style type="text/css">

      html, body {

        height: 100%;

        margin: 0;

        padding: 0;

      }

       

      #map_canvas {

        height: 100%;

      }

      </style>

      <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>

      <script type="text/javascript">

      function initialize() {

          var markerBounds    = new google.maps.LatLngBounds();

          var markers            = new Array(

              [[MarkersArray]]

              );

          var markersTitle            = new Array(

              [[MarkersTitle]]

              );

       

         

          var myOptions = {

              zoom: 5,

              center: new google.maps.LatLng(46.52863469527167,2.43896484375),

              mapTypeId: google.maps.MapTypeId.ROADMAP,

              mapTypeControlOptions: {

                  mapTypeIds: [google.maps.MapTypeId.ROADMAP, google.maps.MapTypeId.HYBRID]

              }

          };

         

          var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

         

          var end = markers.length;

          for(var i=0; i<end; i++) {

              var marker = new google.maps.Marker({

                  position: markers[i],

                  map: map,

                  title: markersTitle[i]

              });

             

              markerBounds.extend(markers[i]);

          }

         

          map.setCenter(markerBounds.getCenter());

          map.fitBounds(markerBounds);

      }

      </script>

      </head>

      <body onload="initialize()">

        <div id="map_canvas"></div>

      </body>

       

      </html>

       

      And then, in the webviewer it calculates (substitutes) a few of those values.

      For clearness ske -  i added the landmarks bit, which is the bit that is not working.

       

      "data:text/html," &

       

      Substitute (Landmarks::Html ;

          [ "[[MarkersArray]]" ; MarkersArray ( 1 ) ] ;

          [ "[[MarkersTitle]]" ; " ' "&Landmarks::Landmark_Name & " ' " ] ;

          [ "¶" ; "" ]

       

      )

       

      So my question is:

      how can i give each marker (pin) that is placed, the name of the field that belongs to the long / lat values that are working correctly,

      as a mouseover title or even a label that is permanently displayed?

       

       

      Thank you and happy holidays

        • 2. Re: Give markers in google maps the name of a field
          haarbol

          Hi,

           

          Thank you for your reply.

          I looked at the method you suggested, but it is not right for what i need.

           

          That other method opens a pop-up window (a second database, actually, making it much slower), you have to run all kinds of scripts before it (the method i have here uses no scripts, except for a calculation that replaces some HTML text), it even alerted my firewall.

          Is it really not possible with a few tweaks to the HTML code i posted? It seems (to my untrained eye) that my current work in progress is sort of close since it can already do the same thing for the LON and LAT values, i only want to include a title in there as well. There is a loop in there - is there no way to include a title array (Landmark_Name) that points to the fields that belong to the same entry as the LON an LAT values?

          • 3. Re: Give markers in google maps the name of a field
            erolst

            Try to pass a list of landmark names from your DB as an array in JavaScript notation; at the moment it's only a single name you're substituting in.

             

            "data:text/html," &

             

            Let (

            markersList = "'" & Substitute ( List ( Landmarks::Landmark_Name ) ; ¶ ; "' '" ) & "'" ; // create a "' 'value1' 'value2' …" array of names

            Substitute ( Landmarks::Html ;

                [ "[[MarkersArray]]" ; MarkersArray ( 1 ) ] ;

                [ "[[MarkersTitle]]" ; markersList ] ;

                [ ¶ ; "" ]

             

            )

            • 4. Re: Give markers in google maps the name of a field
              haarbol

              Hi

               

              Thank you. I knew i was not pushing over an array to the HTML template, i just didn't know how to do that.

               

              At the moment, i'm getting the same results as the previous method though - first pin shows the name of the currently selected field, the rest nothing.

              The only thing i did was copy/paste your calculation script to the webviewer field (and added one more "(" at the end). Is there something else i should maybe change in the webviewer calculation or the html template?

              • 5. Re: Give markers in google maps the name of a field
                erolst

                haarbol wrote:

                Is there something else i should maybe change in the webviewer calculation or the html template?

                 

                Very likely there is; also, my List() suggestion was probably correct in spirit, but not suitable to your existing data structure. I suggest you post a copy of your file for closer inspection.

                • 6. Re: Give markers in google maps the name of a field
                  haarbol

                  Alright, i put it here - https://dl.dropboxusercontent.com/u/9789961/Landmarks.fmp12

                  I filled it up with some theatre-dummy data - when you hover over the pin, you will see only one of the pins displays name data, and it's the data from the currently selected cell.

                   

                  Thanks again.

                   

                  (btw, hopefully nordmann will disable his auto-reply script soon...)

                  • 7. Re: Give markers in google maps the name of a field
                    erolst

                    haarbol wrote:

                    (btw, hopefully nordmann will disable his auto-reply script soon...)

                     

                    I hope so, too, but consider it doubtful …

                     

                    Anyways, here's a corrected version (need to format the array correctly, with '," separating the individual elements):

                     

                    "data:text/html," &

                    Let (

                    markersList = " '" & Substitute ( List ( Landmarks_cart::Landmark_Name ) ; ¶ ; "', '" ) & "' " ; // create a "' 'value1', 'value2' …" array of names

                    Substitute ( Landmarks::Html ;

                        [ "[[MarkersArray]]" ; MarkersArray ( 1 ) ] ;

                        [ "[[MarkersTitle]]" ; markersList ] ;

                        [ ¶ ; "" ]

                    ) )

                     

                    … for which to work you need to create a new TO of Landmarks, name it Landmarks_cart and connect it to the existing TO by joining any two fields via the cartesian operator. Use any other method you like to gather the desired names, but the result must match positionally the markers array … That's why I changed then entire thing to receive the list of coordinates not using a CF and the found set, but instead the new relationship.

                     

                    Here's a modified version, in which you will see the names appear as tooltip when hovering (long enough …) over its marker. Also, the Web Viewer needs to be in focus.

                    • 8. Re: Give markers in google maps the name of a field
                      haarbol

                      Thank you so much. I will have to dive into what you explained later (Christmas family visits now ) but i looked at your modified database and it works perfectly!