Scaling Text Symbols

[FrancoisChartrand]

Hi,

Because the TextSymbols are a MarkerSymbol (therefore using MapPoints), the text do not scale when zooming in/out. Is there a way to make the text to scale when zooming in/out?

Thank you

[DominiqueBroux]

You can do it by defining your own text symbol with a scale property which will be set each time the map extent changes.

For test purposes, I did this:

1) Define a text symbol class with a scale property:

public class MyTextSymbol : MarkerSymbol
{
    public double Scale
    {
        get { return (double)GetValue(ScaleProperty); }
        set { SetValue(ScaleProperty, value); }
    }
 
    public static readonly DependencyProperty ScaleProperty =
        DependencyProperty.Register("Scale", typeof(double), typeof(MyTextSymbol), new PropertyMetadata(1.0));
}

2) Add such a symbol in the resources with a template taking care of the scale:

<local:MyTextSymbol x:Key="myTextSymbol">
<local:MyTextSymbol.ControlTemplate>
<ControlTemplate> 
<TextBlock Text="MyText"  FontFamily="Arial"  FontSize="10"  Foreground="Red"  FontStyle="Italic"  FontWeight="Bold">
<TextBlock.RenderTransform>
  <ScaleTransform ScaleX="{Binding Symbol.Scale}" ScaleY="{Binding Symbol.Scale}" />
        </TextBlock.RenderTransform>
</TextBlock>
</ControlTemplate>
</local:MyTextSymbol.ControlTemplate>
</local:MyTextSymbol>

3) Use this symbol where you need this kind of text symbol (renderer or graphic symbol or feature symbol).


4) Hook up an handler on event map extent changed and extent changing and recalculate the scale in this handler:

private void MyMap_ExtentChanged(object sender, ESRI.ArcGIS.Client.ExtentEventArgs e)
{
var map = sender as ESRI.ArcGIS.Client.Map;
var myTextSymbol = LayoutRoot.Resources["myTextSymbol"] as MyTextSymbol;
const double referenceResolution = 0.5;
double scale = referenceResolution / map.Resolution;
myTextSymbol.Scale = scale;
}


The referenceResolution const has to be adjusted depending on which map scale you want to see the text with a scale of 1.

Note : I guess you will need other DPs for the Text, the FontSize, the FontFamily, ..... but I've simplified for the sample.

[FrancoisChartrand]

Merci Dominique, that's exactly what I needed!

The only drawback of this method is that the text is re-scaled only when the MapExtend has changed, unlike the other geometries (polygons, lines, etc.) that change gradually as the MapExtend is changing.

[DominiqueBroux]

The only drawback of this method is that the text is re-scaled only when the MapExtend has changed, unlike the other geometries (polygons, lines, etc.) that change gradually as the MapExtend is changing.

You can fix that by hooking up the same handler to the map event 'ExtentChanging'.

[FrancoisChartrand]

You can fix that by hooking up the same handler to the map event 'ExtentChanging'.

Working wonderfully! Thank you

[dotMorten_esri]

Another way to do it is to use a Polygon instead and use an ImageFill that stretches with the polygon (the image contains the text). That way you won't have to do anything to make it scale.
Or maybe you could use a Grid in the PolygonTemplate and inside the grid but a ViewBox. Ie. (not completely sure if this will work)
<ControlTemplate>
  <Grid x:Name="Element">
    <ViewBox><TextBox Text="Label"/></ViewBox>
  </Grid>
</ControlTemplate>
Then use a polygon or rectangle geometry. That way you can set the size directly using map units.

[FrancoisChartrand]

Another way to do it is to use a Polygon instead and use an ImageFill that stretches with the polygon (the image contains the text). That way you won't have to do anything to make it scale.

That's what I was doing before Dominique's solution. However, because the text is transformed into an  image, it looks very bad when zooming in because of stretching.

[dotMorten_esri]

ViewBox shouldn't make anything turn into an image. It should preserve crisp edges.