Problem with a chart with a polyline and a LinearGradientBrush

I have a graph with a polyline contained into a canvas. I would like to set the stroke of the polyline starting from a color at the bottom and ending to another color on top. I tried with this xaml:

<Polyline StrokeThickness="2">
  <Polyline.Stroke>
    <LinearGradientBrush StartPoint="0.5,1" EndPoint="0.5,0">
      <GradientStop Color="Blue"  Offset="0" /开发者_C百科>
      <GradientStop Color="Cyan" Offset="1" />
    </LinearGradientBrush>
  </Polyline.Stroke>
</Polyline>

In this way it works but the height of the gradient is equal to the height of the polyline. I mean, if I have a polyline which goes from the bottom of the canvas to its top, the gradient is applied over the entire height of the canvas. If I have instead a horizontal polyline, the gradient is applied to its thickness.

I would like to have a gradient height equal to the canvas height, independently from the polyline height.

How can I achieve this?

The start and stop of the gradient is given by the StartPoint and EndPoint properties of the LinearGradientBrush. Your example shows values that are inside the PolyLine (0.5,1 and 0.5,0). You can have values smaller than 0 or larger than 1 in order to start the gradient before the shape or end after it.

But using relative values may be hard for what you want. Relative values are used because the MappingMode property of the LinearGradientBrush is not explicitly set. The default value is RelativeToBoundingBox, but can be set to Absolute.

This way, you can set the StartPoint to (0,0) and the EndPoint to the width and height of the canvas to get the result you are looking for.