Can "WPF Dynamic Data display" support dual y-axis chart?

Aug 3, 2009 at 4:30 PM

We need to implement 2D-Chart which can display dual y-axis (with different y scale values) with one x-axis scale value.
You may think to combine two graph plots with different y-axis scale and the same x-axis scale into one graph plot.
The first y-axis is left side and the second y-axis is in the right side.

Thx!

Aug 3, 2009 at 9:52 PM

I think you may find your answer here.

 

http://dynamicdatadisplay.codeplex.com/Thread/View.aspx?ThreadId=62284

 

Aug 3, 2009 at 11:18 PM

I can confirm that - you will need the latest nightly build, not the stable. I got it working, with an arbitrary number of series, plotted visually on the same scale, with one x-axis to rule them all.

 

Aug 3, 2009 at 11:32 PM

thanks for the replying Michela44 and Talisman.

There are three features we need:

1) We need to scale the y-axis differently. One y-axis is in the left  (for example, 0-100) and another y-axis in right (for example, 500-1000).

2) We need to display y-axis title one in left (speed) and another one in right (Temperature).

3) One plot with speed vs time base on left y-axis scale and another ploat with Temperature vs time base on right y-axis scale 

I download the example code in "TwoIndependentAxis".

It display two y-axis on the left side and one y-axis on the right side.  How can I only show one on the left side and keep right side Y-axis?

When you talk about latest nightly build, where to get it?

thx!

 

 

Aug 4, 2009 at 12:04 AM

In the two-independent axis example the InjectedPlotter (named innerPlotter) has been given two VerticalAxis objects in its definition. Simply remove the one you do not want.

The latest nightly build is available under "Source Code" in the menu above here on Codeplex: http://dynamicdatadisplay.codeplex.com/SourceControl/ListDownloadableCommits.aspx

Just click on the latest version (change set) available, and Download.

 

Aug 4, 2009 at 12:18 AM

Hi talisman,

Thanks for your replying!

I remove the left axis, it works! However, the axis title still show on the left side,

Is there a way we can put the axis title on the right side of y-axis?

thx!

<font size="4" color="#0000ff">

<

</font>

 

d3:ChartPlotter Name="plotter">  

  <d3:InjectedPlotter Name="innerPlotter" Background="Red">  

  <d3:VerticalAxis Placement="Right"/>  <font color="#a31515">

 

</font>

 <d3:VerticalAxisTitle Content="Speed (100 RPM)" /> 

 <d3:RectangleHighlight Bounds="0.3,0.3,0.1,0.1"/> <font color="#a31515">

 

</font>

</d3:InjectedPlotter>

Editor
Aug 4, 2009 at 2:40 AM
Edited Aug 4, 2009 at 2:47 AM

Hi,

Currentrly there no means to move axis title to the right, but you can easily do it yourself - find in VerticalAxisTitle method PlotterAttached and fix to to add not to the LeftPael, but to the right one. I'll do smth with this later.

Best regards,

Mikhail.

 

Aug 5, 2009 at 8:38 PM
Edited Aug 5, 2009 at 10:42 PM

Hi Mikhail,

I follow your suggestion to add the class and use RightPanel make the AxisTitle show on the right side.

I add the class in the DynamicDataDisplay project under TwoIndependentAxis solution.

public class VerticalAxisTitleRight : ContentControl, IPlotterElement
public void OnPlotterAttached(Plotter plotter)
    {
      this.plotter = plotter;
      plotter.RightPanel.Children.Insert(1, this);
    }
What is the reason to use InjectedPlotter?
Is it possible that we can plot two lines: one line is base on left y-axis scale 
and another line is base on right y-axis scale?
thx!
Aug 6, 2009 at 6:44 AM
Is it possible that we can plot two lines: one line is base on left y-axis scale 
and another line is base on right y-axis scale?
Yes, I can use Plotter and InnerPlotter to achieve it.
Plotter.AddLineGraph (source1, colors.Goldenrod, 2, "speed");
innerPlotter.AddLineGraph(source2, Colors.Blue, 2, "Temperature");
The problem with this implementation is that "Temperature" Description in innerPlotter does not show up.
Is there a way that letting the innerPlottter Description also display?
thx!
Editor
Aug 9, 2009 at 7:25 AM

Hi,

Please take a look at a TwoLinesSamples in source code from Source Code page - I've changed it a little, maybe those changes will help you.

This sample now looks this:

 

This and more pics are available at http://dynamicdatadisplay.codeplex.com/Wiki/View.aspx?title=Development-time%20screens

 

Best regards,

Mikhail.

Aug 3, 2010 at 7:34 AM
Edited Aug 3, 2010 at 7:44 AM

Hi Mikhail,

 

where do I find the TwoLinesSample that you mention above?

 

Best regards,

Robin

 

//Edit

Alright, I already found it :-)

Aug 3, 2010 at 9:32 AM
I believe the basic sample is at change set 31108\src\DevSamples\TwoIndependentAxes
 
Search through the threads to find how to bind the two lines together for zooming and scrolling
Mar 26, 2014 at 12:45 PM
Hi

I am in analyzing the D3 chart controls to draw 3rd y axis. I saw this thread with Mikhail response which was exactly matching my requirement. I tried to refer the code from the path "31108\src\DevSamples\TwoIndependentAxes" for plotting TwoLine Sample across the two vertical axis. After i download the code, both the DynamicDataDisplay.dll and DynamicDataDisplay.Maps.dll was showing reference error. Once i gave the reference to both then i got build errors.
  • The type 'd3:InjectedPlotter' was not found. Verify that you are not missing an assembly reference and that all referenced assemblies have been built.
  • The property 'Placement' was not found in type 'VerticalAxisTitle'.
  • The property 'Placement' was not found in type 'AxisNavigation'.
  • The property 'Placement' was not found in type 'AxisNavigation'.
  • A value of type 'Button' cannot be added to a collection or dictionary of type 'ChildrenCollection'.
Can Anyone of you give me some working sample with the latest dll updates.
Apr 28, 2014 at 11:08 PM
I am also trying to set up a dual y-axis chart, in this case with a TimeData x-axis. I am using the latest "nightly" release (94877).

I am able to get the plotter working but cannot put a label on the "Main" y axis. The XAML I try to use includes:
         <d3:InjectedPlotter Name="innerPlotter" Background="Aqua" SetViewportBinding="False" >
            <d3:VerticalAxis Placement="Right"/>
            <d3:VerticalAxisTitle Content="kWh" Placement="Right"/>
        </d3:InjectedPlotter>
        <d3:ChartPlotter.MainHorizontalAxis>
            <d3:HorizontalDateTimeAxis Name="dateAxis"/>
        </d3:ChartPlotter.MainHorizontalAxis>

        <d3:VerticalAxisTitle FontFamily="Arial" Content="Power (W)" Placement="Left"/>
        <d3:HorizontalAxisTitle FontFamily="Arial" Content="Date"/>
The statement setting the VerticalAxisTitle raises an error, to the effect that "This property has already been set"

Any thoughts on what I am doing wrong, or is this a bug?
May 5, 2014 at 9:34 AM
Hi

I think adding the MainHorizontalAxis is the problem.

Try this
<d3:ChartPlotter>
    <d3:InjectedPlotter Name="innerPlotter" Background="Aqua" SetViewportBinding="False" >
        <d3:VerticalAxis Placement="Right"/>
        <d3:VerticalAxisTitle Content="kWh" Placement="Right"/>
        <d3:HorizontalDateTimeAxis Name="dateAxis"></d3:HorizontalDateTimeAxis>
    </d3:InjectedPlotter>
    <!--<d3:ChartPlotter.MainHorizontalAxis>
        <d3:HorizontalDateTimeAxis Name="dateAxis"/>
    </d3:ChartPlotter.MainHorizontalAxis>-->

    <d3:VerticalAxisTitle FontFamily="Arial" Content="Power (W)" Placement="Left"/>
    <d3:HorizontalAxisTitle FontFamily="Arial" Content="Date"/>
</d3:ChartPlotter>
It's working for me.