Symbol with a sprite or flex component

[MattStrum]

I would like to have a marker that is just a sprite or a flex component.  InfoSymbol looks promising but I don't want a bubble around my component.  Is there any support for this?

[SarthakDatt]

Hey,

Are looking to add this marker on the map(as part of a graphic)?
If not, you can call Symbol.createSwatch()(http://help.arcgis.com/en/webapi/flex/apiref/com/esri/ags/symbols/Symbol.html#createSwatch()).It returns a UIComponent.

[MattStrum]

No, I'm looking to add a UIComponent to the map.  EDIT: Or even just a sprite

Swatches do look very useful though, thanks for pointing me to that.

[SarthakDatt]

Matt,

Here is another thought, looking at the PictureMarkerSymbol.source(http://help.arcgis.com/en/webapi/flex/apiref/com/esri/ags/symbols/PictureMarkerSymbol.html), you could try setting your UIComponent and/or sprite as source of the PMS.

Something like:

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.adobe.com/flex/spark"
               xmlns:esri="http://www.esri.com/2008/ags"
               xmlns:mx="library://ns.adobe.com/flex/mx"
               initialize="application1_initializeHandler(event)">

    <fx:Script>
        <![CDATA[
            import com.esri.ags.symbols.PictureMarkerSymbol;
            
            import mx.controls.CheckBox;
            import mx.events.FlexEvent;
           
            [Bindable]
            private var tempSymbol1:PictureMarkerSymbol;
            
            protected function application1_initializeHandler(event:FlexEvent):void
            {
                tempSymbol1 = new PictureMarkerSymbol();
                tempSymbol1.source = CheckBox;   // has to be the class itself, right now it cannot be an instance of the class
                tempSymbol1.width = 50;
                tempSymbol1.height = 50;
            }

        ]]>
    </fx:Script>
    
    <esri:Map>
        <esri:ArcGISTiledMapServiceLayer url="http://server.arcgisonline.com/ArcGIS/rest/services/World_Physical_Map/MapServer"/>
        <esri:GraphicsLayer symbol="{tempSymbol1}">
            <esri:Graphic>
                <esri:MapPoint x="0" y="0"/>
            </esri:Graphic>
        </esri:GraphicsLayer>
    </esri:Map>
</s:Application>

or alternatively:

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.adobe.com/flex/spark"
               xmlns:esri="http://www.esri.com/2008/ags"
               xmlns:mx="library://ns.adobe.com/flex/mx"
               initialize="application1_initializeHandler(event)">

    <fx:Script>
        <![CDATA[
            import com.esri.ags.symbols.PictureMarkerSymbol;
            
            import mx.controls.CheckBox;
            import mx.events.FlexEvent;
           
            [Bindable]
            private var tempSymbol1:PictureMarkerSymbol;
            
            protected function application1_initializeHandler(event:FlexEvent):void
            {
                tempSymbol1 = new PictureMarkerSymbol();
                tempSymbol1.source = TestGraphics;  
                tempSymbol1.width = 50;
                tempSymbol1.height = 50;
            }

        ]]>
    </fx:Script>
    
    <esri:Map>
        <esri:ArcGISTiledMapServiceLayer url="http://server.arcgisonline.com/ArcGIS/rest/services/World_Physical_Map/MapServer"/>
        <esri:GraphicsLayer symbol="{tempSymbol1}">
            <esri:Graphic>
                <esri:MapPoint x="0" y="0"/>
            </esri:Graphic>
        </esri:GraphicsLayer>
    </esri:Map>
</s:Application>

where TestGraphics.mxml is:

<?xml version="1.0" encoding="utf-8"?>
<s:Group xmlns:fx="http://ns.adobe.com/mxml/2009" 
         xmlns:s="library://ns.adobe.com/flex/spark" 
         xmlns:mx="library://ns.adobe.com/flex/mx" width="30" height="50">
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>
    <s:Ellipse height="100%" width="100%">
        <s:fill>
            <s:SolidColor color="0xff0000"/>
        </s:fill>
    </s:Ellipse>
</s:Group>

Hope that helps.

[MattStrum]

Without being able to create an instance I'm not sure it's useful to me.  I generate a lot of different symbols which have numbers, colors, etc. based on various values.  I'm coming from the Google Maps API for Flash which had this ability so I'm trying to find something which can do something similar.

[RobertScheitlin__GISP · Accepted solution]

Matt,

   You might want to look at this thread where I helped Hannes with a FXP project that extends the APIs sybmbol and draws stacked bar chart based on the attributes of two fields.

http://forums.arcgis.com/threads/49695-Help-Drawing-bar-or-pie-charts-on-the-map-from-feature-layer!

Don't forget to click the Mark as answer check and to click the top arrow (promote) as shown below:

[MattStrum]

Thanks for the help, that looks like what I need.  I wanted to extend the symbol class but couldn't find any documentation on how to do it so perhaps this might be something to add to the examples 🙂