Search code examples
wpfwpf-controlsdata-visualizationwpftoolkitdatavisualization.toolkit

Idiomatic way to draw a curve over a bar series chart


What I have is a BarSeries to display a histogram (rotated by 90 degrees, compared to the common way to draw histograms).

Putting aside the question if that's the best way to go about drawing a histogram, using the classes in System.Windows.Controls.DataVisualization (although comments are welcome), what would be the best way to draw a curve over such a chart?

This curve (just a dotted line gaussian in my case) must be probably scaled and positioned inside the "coordinate system" of the chart. (The scare quotes are intended to indicate that with a bar series chart, there isn't a actual two-dimensional coordinate system, but adjusting bar dimensions and gaps I think it could effectively be turned into one.)

I've done a bit of research and started played around a bit with AdornerDecorators providing me with a AdornerLayer to draw on, but there are also StackedPanels and potentially other options, so if anyone knows of a good way to implement what I need, that'd probably save me a lot of trial-and-error.


Solution

  • Just add both a ColumnSeries as well as a LineSeries inside the same Chart element. The following snippet also contains the LayoutTransform which rotates the whole thing.

    <Grid>
      <Chart>
        <Chart.LayoutTransform>
          <RotateTransform CenterX="0.5" CenterY="0.5" Angle="90"/>
        </Chart.LayoutTransform>
    
        <ColumnSeries></ColumnSeries>
        <LineSeries></LineSeries>
      </Chart>
    </Grid>