Select to view content in your preferred language

Labels on a map - User input

487
2
Jump to solution
02-12-2013 07:30 AM
ionarawilson1
Regular Contributor II
I need to create a tool to allow the user to place labels on different parts of the map. The labels can change according to user input. So I used the drawtool to create a point and when the point is created a symbol is added to the map. The symbol is a composite symbol that has a marker symbol for the point (but I set its size to 1 to make it invisible), and a textsymbol.

So The user clicks on a button to activate the drawtool mappoint tool, adds the text and on the application. There is a textinput that he enters the text that is going to appear on the label. Everything works great. The problem is that since the text of the textsymbol is binded to the text input control, everytime the user wants to create another label, he enters another text in the text input and it changes the previous label text to the new text input that he just entered. How can I prevent this from happening?  Do you guys have a better way to do this? Thank you!

Here is the symbol and the drawtool
  <esri:CompositeSymbol id="composite">          <esri:symbols>     <esri:SimpleMarkerSymbol id="tst" size="1" style="circle" color="0xFF0000"  />     <esri:TextSymbol id="label"  background="true" text="{labeltext.text}" color="0xFF0000" >      <flash:TextFormat size="15" font="Verdana" bold="true" italic="false" underline="false"  />     </esri:TextSymbol>    </esri:symbols>   </esri:CompositeSymbol>              <esri:DrawTool id="myDrawToollabel"         drawEnd="drawTool_drawEndHandlerlabel(event)"         markerSymbol="{composite}"         graphicsLayer="{myGraphicsLayerlabel}"                           map="{myMap}"         />


Here is the textinput

         <mx:VBox>                <mx:HBox paddingTop="10">               <mx:Text color="#76410C" width="43" text="Label Text" paddingLeft="8"/>        <mx:TextInput id="labeltext" width="130" maxChars="55"  />                 </mx:HBox>        <mx:HBox paddingLeft="50" paddingBottom="8">                      <mx:Button click="addtext()" label="Label Map" />        </mx:HBox>      </mx:VBox>


Here are the functions for the drawtool
         private function addtext():void  {    myDrawToollabel.activate(DrawTool.MAPPOINT)         }       private function drawTool_drawEndHandlerlabel(event:DrawEvent):void       {            myDrawToollabel.deactivate()      }    
Tags (2)
0 Kudos
1 Solution

Accepted Solutions
ionarawilson1
Regular Contributor II
Thank you Yann,

I ended up finding another way by adding an event listener to the map click and then refreshing the graphics layer. Here is the code:

     private function addtext():void  {       myMap.addEventListener(MapMouseEvent.MAP_CLICK, onClickFunction);      }       private function onClickFunction(event:MapMouseEvent):void       {            const mapPoint:MapPoint = event.mapPoint;    mapPoint.spatialReference = new SpatialReference(102100);        var myGraphicMarker:Graphic = new Graphic(mapPoint, new TextSymbol(labeltext.text,null,0x000000,1, true,0x000000,true,0xffffff,"middle",0,0,0));        //myGraphicMarker.toolTip = "Marker added with ActionScript";    pointGraphicsLayer.add(myGraphicMarker);    pointGraphicsLayer.refresh();      }    

View solution in original post

0 Kudos
2 Replies
YannCabon
Esri Contributor
Hi,

Use the textAttribute property on the TextSymbol to specify which attribute of your Graphics as text.
In the example below, each Graphic has an attribute myLabelField.

    <esri:Map>
        <esri:ArcGISTiledMapServiceLayer/>

        <esri:GraphicsLayer>

            <!-- Note: the TextSymbol defines the attribute to use as the text -->
            <esri:symbol>
                <esri:CompositeSymbol>
                    <esri:SimpleMarkerSymbol color="0xFF0000"
                                             size="1"
                                             style="circle"/>
                    <esri:TextSymbol background="true"
                                     color="0xFF0000"
                                     textAttribute="myLabelField">
                        <flash:TextFormat bold="true"
                                          font="Verdana"
                                          italic="false"
                                          size="15"
                                          underline="false"/>
                    </esri:TextSymbol>
                </esri:CompositeSymbol>
            </esri:symbol>

            <esri:Graphic>
                <esri:geometry>
                    <esri:WebMercatorMapPoint lon="-4.485556" lat="48.390834"/>
                </esri:geometry>
                <esri:attributes>
                    <fx:Object myLabelField="Brest"/>
                </esri:attributes>
            </esri:Graphic>

            <esri:Graphic>
                <esri:geometry>
                    <esri:WebMercatorMapPoint lon="-117.1825" lat="34.054722"/>
                </esri:geometry>
                <esri:attributes>
                    <fx:Object myLabelField="Redlands"/>
                </esri:attributes>
            </esri:Graphic>

        </esri:GraphicsLayer>
    </esri:Map>
0 Kudos
ionarawilson1
Regular Contributor II
Thank you Yann,

I ended up finding another way by adding an event listener to the map click and then refreshing the graphics layer. Here is the code:

     private function addtext():void  {       myMap.addEventListener(MapMouseEvent.MAP_CLICK, onClickFunction);      }       private function onClickFunction(event:MapMouseEvent):void       {            const mapPoint:MapPoint = event.mapPoint;    mapPoint.spatialReference = new SpatialReference(102100);        var myGraphicMarker:Graphic = new Graphic(mapPoint, new TextSymbol(labeltext.text,null,0x000000,1, true,0x000000,true,0xffffff,"middle",0,0,0));        //myGraphicMarker.toolTip = "Marker added with ActionScript";    pointGraphicsLayer.add(myGraphicMarker);    pointGraphicsLayer.refresh();      }    
0 Kudos