Measurement Studio for .NET Languages

Showing results for 
Search instead for 
Did you mean: 

WPF graph cursor HorizontalCrosshairLength property

Go to solution



In my aplication I use Cursor and RangeCursor on wpf  ni:Graph. 

I want to bind Cursor HorizontalCrosshairlength property to RangeCursor HorizontalRange property. When I change RangeCursor horizontal size I must set to HorizontalCrosshairlength to the same size. But datatypes are different.

I attached screenshot and sample project.


I hope someone can help me with this.


Best Regards.


Download All
0 Kudos
Message 1 of 6

Yes, the range cursor uses data values for the filled area, while the single-point cursor uses relative values for the crosshair.


Instead of using two cursors, it would be easier to customize the display of the range cursor to add crosshairs:

public class CrosshairRangeCursor : RangeCursor {
    private static readonly Range<double> FullRelativeRange = Range.Create( 0.0, 1.0 );

    private readonly RenderTargetOptions _crosshairOptions;

    public CrosshairRangeCursor( ) {
        _crosshairOptions = new RenderTargetOptions( this,
            RenderTargetOption.CreateValue( RenderTargetOptionsProperty.Stroke, Brushes.Red ),
            RenderTargetOption.CreateBinding( RenderTargetOptionsProperty.StrokeThickness, CrosshairThicknessProperty ) );

    protected override void RenderGraphCore( RenderArgs args ) {
        base.RenderGraphCore( args );

        Range<double> horizontalRelativeRange = GetRelativeHorizontalRange( ) ?? FullRelativeRange;
        Range<double> verticalRelativeRange = GetRelativeVerticalRange( ) ?? FullRelativeRange;

        Size pointSize = new Size( 10.0, 10.0 );
        Point relativeCenter = new Point(
            Center( horizontalRelativeRange ),
            Center( verticalRelativeRange ) );
        args.RenderTarget.DrawShape( _crosshairOptions, relativeCenter, PointShape.Ellipse, pointSize );

        double relativeLength = horizontalRelativeRange.Maximum - relativeCenter.X;
        args.RenderTarget.DrawConstantLine( _crosshairOptions, Orientation.Horizontal, relativeCenter, +relativeLength, pointSize.Width / 2.0, 0.0 );
        args.RenderTarget.DrawConstantLine( _crosshairOptions, Orientation.Horizontal, relativeCenter, -relativeLength, pointSize.Width / 2.0, 0.0 );

    private static double Center( Range<double> range )
        => (range.Maximum + range.Minimum) / 2.0;
~ Paul H
0 Kudos
Message 2 of 6

Thanks for your help,


the crosshairs should be dragged up and down when left-clicking with the mouse and I need to get or set the crosshair y-axis value. I guess these features of the cursor crosshair do not exist here.


Best Regards,


0 Kudos
Message 3 of 6
Accepted by topic author yrnhkn

Ah, that makes sense! Definitely no need to re-implement cursor interaction. To have the single-point cursor follow the range cursor, just need to update settings whenever the range cursor changes position:


public MainWindow( ) {
    InitializeComponent( );

    rangeCursor1.PositionChanged += OnRangeCursorPositionChanged;

private void OnRangeCursorPositionChanged( object sender, EventArgs e ) {
    // Update the crosshair cursor to fit the new horizontal range.
    Range<double> relativeRange = rangeCursor1.GetRelativeHorizontalRange( ) ?? FullRelativeRange;
    Point relativePosition = cursor1.GetRelativePosition( );
    relativePosition.X = Center( relativeRange );
    cursor1.SetRelativePosition( relativePosition );
    cursor1.HorizontalCrosshairLength = relativeRange.Maximum - relativePosition.X;



(Note: this uses helpers defined in the previous code example, and the Label values need to change to x:Name values in the XAML in order to access the components by name.)

~ Paul H
0 Kudos
Message 4 of 6

Thanks Paul. This works fine.

0 Kudos
Message 5 of 6

Hi Paul, There is a problem in that horizantal cursor. The single-point cursor should be dragged up and down when left-clicking with the mouse. But it cannot be moved left and right. I attached two image. I marked  point on first image . When I pressed on that point, the single-point cursor move left and right which we dont want this behaviour. You can see this situation in the second photo.  Our cursor code is below.


Thanks for your help.





<ni:Cursor x:Name="ThresholdChannel1"
Visibility="{Binding Channel1Visibility }"
ValueVisibility="Collapsed" VerticalCursor="SizeNS" Cursor="SizeNS" InteractionMode="Mouse">
<SolidColorBrush Color="White" Opacity="0.5"/>

0 Kudos
Message 6 of 6