3 Replies Latest reply on Jul 7, 2009 9:44 AM by _Natasha_

    Highlighting specific marker in a Flex Google Map?

    CCMPO

      Hello, I have a question on how to perform a specific task.  I have my map binded to a datagrid.  Each record in the datagrid is a marker on the map, so when you click on a record, it zooms in and centers on the appropriate marker.  My question is how to highlight the marker that is selected.  Right now, when the map loads, all markers are one color.  When I click on a record, I want the corresponding marker to be highlighted to distinguish it from the rest.  Just like when a record is selected, it becomes highlighted itself.

       

      Here is what it looks like so far based on what I described.   http://www.corpuschristi-mpo.org/CMS/baldwin.swf

       

      Any and all help would be appreciated.  If needed, i can post the code, but I didn't know what the rules were in regards to that on these forums since this is my first post.  Thanks.

        • 1. Re: Highlighting specific marker in a Flex Google Map?
          _Natasha_ Level 4

          Hi,

          datagrid has selectedItem property and olso has an events for listening changes of selecting selectdItem (like itemFocusIn and itemFocusOut).

          So you can get a record of selected item and get a link to Marker.

           

          The easiest way is to change fillColor for selected marker.

          var options:MarkerOptions = new MarkerOptions( { fillStyle: { color: 0xFF0000 }} );
          myMarker
          .setOptions(options);

          So you can highlight Marker on itemFocusIn and set color back on itemFocusOut event.

           

          Hope this helpful.

          • 2. Re: Highlighting specific marker in a Flex Google Map?
            CCMPO Level 1

            Hi,

             

            I can kinda see what you're getting at but can't seem to implement it...probably due to my small grasp on the coding.  Was I suppose to create a private function that the grid calls on, i.e,  itemFocusIn="focusInClick (event)"?  if that was the case, it didn't work out for me.  I've attacted a sample code with only two markers.  If you wouldn't mind, could you show me how to do it inside my code?  Thanks.

            • 3. Re: Highlighting specific marker in a Flex Google Map?
              _Natasha_ Level 4

              Your code is not the same as you write before.

              You can use record like itemFocusIn="focusInClick (event)" and the same for itemFocusOut="onFocusOut(event)".

              You have already event for itemClick event. It's the same event.

              The first. Do you understand that you center map only if user click on the row. But if user change item using keyboard map will not center to that point.

              The second. onMapReady you create a Marker for each row. After that you don't have any link to that Markers. If you need to have a data for datagrid in xml, you need to save an array of this Markers to highlight them (for example in associative array with data@id as a key).

               

              So in each event you should get @id from current item data and get marker for it and change it style.

               

              If you don't understand, take it easy to ask an code.