TeeChart NET for Blazor drawing line on a graph

TeeChart for Microsoft Visual Studio .NET, Xamarin Studio (Android, iOS & Forms) & Monodevelop.
Post Reply
dynamicrisk
Newbie
Newbie
Posts: 26
Joined: Thu Apr 06, 2023 12:00 am

TeeChart NET for Blazor drawing line on a graph

Post by dynamicrisk » Tue Aug 20, 2024 3:49 pm

Hi,

I am trying to draw a vertical hatched line on a blazor graph. We were previously using Graphics3D.Line(int x0, int y0, int x1, int y1) but I am not seeing an equivalent method for jScript in the JsDoc reference. If there is a way to do this could you please let me know.

Thanks

Edu
Newbie
Newbie
Posts: 40
Joined: Tue Nov 28, 2023 12:00 am

Re: TeeChart NET for Blazor drawing line on a graph

Post by Edu » Wed Aug 21, 2024 9:03 am

Hello,

To draw a vertical line on a Blazor chart, you can do so like this, for example:

Code: Select all

Chart1.ondraw=function() {
    const ctx = Chart1.ctx;
    let x1 = Chart1.axes.bottom.calc(9);
    y1 = Chart1.axes.left.startPos;
    y2 = Chart1.axes.left.endPos;
    ctx.beginPath();
    ctx.moveTo(x1, y1);
    ctx.lineTo(x1, y2);
    ctx.closePath();
    ctx.lineWidth = 2;
    ctx.strokeStyle = "red";
    ctx.stroke();
}
In this example, I'm drawing a vertical red line where x = 9. Please adjust color/width/position as you need.
To add this on the jScript code, you can use the CustomCode property (mChart.Export.Image.JScript.CustomCode )

If you have any further questions or need additional assistance, please don't hesitate to reach out.

Regards,
Edu
Edu
Steema Support

Post Reply