topic Re: Line symbol with outlines in ArcGIS API for Silverlight Questions

Line symbol with outlines

JoannaLaroussi — Thu, 03 Nov 2011 18:41:53 GMT

I am using simple line symbol to draw my lines. I would like to differentiate some of them by adding outline. Could somebody point me to any sample with XAML code, or help to change my code?

My current code for drawing lines looks like this:

<esri:SimpleLineSymbol x:Key="2_D2DRouteLineSymbol">
                <esri:SimpleLineSymbol.ControlTemplate>
                    <ControlTemplate x:Name="D2DRoute2SymbolTemplate">
                        <Grid>
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="D2DRoute2SelectionGroup">
                                    <VisualState x:Name="Normal">
                                        <Storyboard>
                                            <ColorAnimation Storyboard.TargetName="Element"
         Storyboard.TargetProperty="(Stroke).(Color)"
         To="#FF6600" Duration="0:0:0.1" />
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="MouseOver">
                                        <Storyboard>
                                            <ColorAnimation Storyboard.TargetName="Element"
         Storyboard.TargetProperty="(Stroke).(Color)"
         To="Cyan" Duration="0:0:0.1" />
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Selected">
                                        <Storyboard>
                                            <ColorAnimation Storyboard.TargetName="Element"
                                                Storyboard.TargetProperty="(Stroke).(Color)"
                                                To="Cyan" Duration="0:0:0.1" />
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Path x:Name="Element" Stroke="Aqua" Fill="{x:Null}" StrokeStartLineCap="Round" StrokeThickness="4" StrokeLineJoin="Round" StrokeEndLineCap="Round" />
                        </Grid>
                    </ControlTemplate>
                </esri:SimpleLineSymbol.ControlTemplate>
            </esri:SimpleLineSymbol>

Re: Line symbol with outlines

PreetiMaske — Thu, 03 Nov 2011 23:02:20 GMT

Can you explain why you want to differentiate them using XAML?

Is there any attribute that makes them look different? Have you considered applying UniqueValueRenderer to the layer. UVR will display all different values with different symbol for each type. All you would need is to set the UniqueValueRenderer.

Another option may be to define subtypes at the GDB level?

Thanks,
Preeti

Re: Line symbol with outlines

JoannaLaroussi — Fri, 04 Nov 2011 12:28:21 GMT

I would like to differentiate them, because they belong to the different group of variables. In general the application is used to query multiple datasets and display results in visual and tabular forms. I have three line datasets with thousands of features each, so defining symbology on map/gdb level looks not efficient for me. Since user can query not more than ten variables at a time, I am using ten different line symbols to display them (in each of three categories). Because my third category can be displayed on the map together with first or second (first and second cannot be displayed together), I need make its symbology different from these used to display first and second group of variables. I cannot just use different colors, so I am looking for the way of changing simple line symbol to line with outlines. I tried dashed line, but this does not work well in my case.
So in summary: I am looking for a sample code how to draw line with outlines.
Thanks in advance for helping out.

Re: Line symbol with outlines

JenniferNery — Fri, 04 Nov 2011 14:24:36 GMT

You can look at custom line symbols here: http://help.arcgis.com/en/webapi/silverlight/samples/SymbolGalleryWeb/start.htm

Also, as Preeti suggested. If you plan to define multiple symbols, you can use a Renderer. Here's an example of doing this on client-side: http://help.arcgis.com/en/webapi/silverlight/samples/start.htm#RenderersXAML. Each graphic will get a symbol depending on their Attribute value.

Re: Line symbol with outlines

JoannaLaroussi — Fri, 04 Nov 2011 14:51:03 GMT

Thank you for your answers! I found in custom line symbols one symbol which may work for me:

<esri:LineSymbol x:Key="CustomRedYellowLineSymbol" Width="4">
    <esri:LineSymbol.Color>
      <LinearGradientBrush StartPoint="0,0" EndPoint="4,4" MappingMode="Absolute" SpreadMethod="Repeat">
        <GradientStop Color="Red" Offset="0.5" />
        <GradientStop Color="Yellow" Offset="0.5" />
      </LinearGradientBrush>
    </esri:LineSymbol.Color>
</esri:LineSymbol>

The question is now, how to implement it into code in a way I can still use Visual States (I would like still to be able to highlight my line, when the mouse is over it).

Here is my original code:

<esri:SimpleLineSymbol x:Key="2_D2DRouteLineSymbol">
                <esri:SimpleLineSymbol.ControlTemplate>
                    <ControlTemplate x:Name="D2DRoute2SymbolTemplate">
                        <Grid>
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="D2DRoute2SelectionGroup">
                                    <VisualState x:Name="Normal">
                                        <Storyboard>
                                            <ColorAnimation Storyboard.TargetName="Element"
         Storyboard.TargetProperty="(Stroke).(Color)"
         To="#FF6600" Duration="0:0:0.1" />
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="MouseOver">
                                        <Storyboard>
                                            <ColorAnimation Storyboard.TargetName="Element"
         Storyboard.TargetProperty="(Stroke).(Color)"
         To="Cyan" Duration="0:0:0.1" />
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Selected">
                                        <Storyboard>
                                            <ColorAnimation Storyboard.TargetName="Element"
                                                Storyboard.TargetProperty="(Stroke).(Color)"
                                                To="Cyan" Duration="0:0:0.1" />
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Path x:Name="Element" Stroke="Aqua" Fill="{x:Null}" StrokeStartLineCap="Round" StrokeThickness="4" StrokeLineJoin="Round" StrokeEndLineCap="Round" />
                        </Grid>
                    </ControlTemplate>
                </esri:SimpleLineSymbol.ControlTemplate>
            </esri:SimpleLineSymbol>

I tried to past sample into few different places, but everything what I was able to do is:

<esri:SimpleLineSymbol x:Key="1_D2DRouteLineSymbol" Width="4">
               esri:LineSymbol.Color>
                    <LinearGradientBrush StartPoint="0,0" EndPoint="4,4" MappingMode="Absolute" SpreadMethod="Repeat">
                        <GradientStop Color="#0033FF" Offset="0.5" />
                        <GradientStop Color="#FFFFFF" Offset="0.5" />
                    </LinearGradientBrush>
                </esri:LineSymbol.Color>
</esri:SimpleLineSymbol>

Which does not allows me for any highlighting.