2

グラフ上の線に変換する一連の点があります。私が望むのは、グラフの下の領域にグラデーションの塗りつぶしを与えることです。これは、このようなブルー​​ムバーグ グラフにいくぶん似ています。

グラフの例

私の質問には 3 つの部分があります。

  • まず、グラフの下の領域だけを埋めるにはどうすればよいですか?
  • 第二に、それをグラデーションで塗りつぶすにはどうすればよいですか?
  • 最後に、同じグラフに複数の線がある場合、複数の線の下の領域にはグレースケールのグラデーション塗りつぶしが必要ですが、これをどのように設定しますか?

私の最大の問題は、使用するデータ構造を決定することです。多くの多面形状 (線/データ系列ごとに 1 つ) を使用して、ブラシに描画するように指示できます。

  • 形が無ければ透明
  • 1 つのシリーズの色 (グラデーションを与えるための高さに対するアルファ)
  • 複数の形状の場合は黒 (グラデーションを与えるために高さに対するアルファ)

その後、シェイプの境界を白で描画します。

ありがとう、

ガブ

4

1 に答える 1

6

グラデーション効果は、VisibloxSilverlightChartsの無料バージョンを使用して可能です。このコンテキストのアプリケーションにVisibloxチャートを適用する方法については、サンプルアプリケーション「Hindsight」を参照してください。

この効果を実現する方法について、XAMLの大まかなコードスニペットを添付しました。

<UserControl x:Class="SilverlightApplication1.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:v="clr-namespace:Visiblox.Charts;assembly=Visiblox.Charts">

<UserControl.Resources>
    <LinearGradientBrush x:Key="GradientBrush" StartPoint="1.0, 0.0" EndPoint="1.0, 1.0">
        <GradientStop Color="AliceBlue" Offset="0.3" />
        <GradientStop Color="DarkBlue" Offset="0.7" />
    </LinearGradientBrush>
</UserControl.Resources>

<Grid x:Name="LayoutRoot" Background="White">
    <v:Chart x:Name="Chart">
        <v:Chart.Series>
            <v:LineSeries x:Name="Series" ShowArea="True" AreaFill="{StaticResource GradientBrush}"/>
        </v:Chart.Series>
    </v:Chart>
</Grid>

個人的には、プロット領域に複数の系列がある場合に線の下の領域を削除して、Hindsightが行うアクションを実行します。その時点で、勾配がデータの邪魔になると思います。前述のように、これについて何かを行うと、計算コストが発生します。これはまた、データの誤解につながる可能性があるため、注意が必要です。

データをグラフに取り込むという点では、Visiblox BindableDataSeriesを使用して、ビジネスオブジェクトをグラフに直接バインドできます。:)

開示：私は以前、VisibloxChartsの開発者として働いていました。

お役に立てれば！

于 2011-01-07T13:42:08.173 に答える