Perspective Scatter Plot

Is there a way to make the perspective XY Chart component display a scatter plot?

The closest I’ve come is setting the line.appearance.stroke.width property to 0 and setting the line.appearance.bullets[0].enabled property to true. But this takes a ridiculous amount of time to render and even with bullet width and height set to 1 they are huge. This is using a moderate dataset with ~20k pairs.

Am I missing something?

Hi, I have the same issue. Is there any solution recommended?

This is possible with the Time Series Chart. You’ll need to create a trend, and once created, you’ll be able to assign that trend to display as a Scatter Plot:
image
image

1 Like

Yes, it would be great to have this available on the XY Chart component for data that isn’t time series, like Power vs RPM. There are many cases where these kinds of plots give our technicians insight to machine performance.

3 Likes

Hi there, were you able to create a chart for power vs rpm or similiar?
Thanks in advance

It's disappointing, but still no with the XY Chart in perspective.

did anyone ever find the solution to this?

The Apexcharts addon supports all types of charts.
I know it isn't the builtin XY Plot, but they work great.

Shameless plug.

2 Likes

I really need to download and test these out.

1 Like

No, the built in XY Chart hasn't seen much care. I just started testing Embr-Charts for these. It performs great on the datasets I've tested - 10k to 50k pairs, virtually zero render time.

3 Likes

Love to hear it.

The limiting factor when drawing large datasets (100k+ points) is actually just that they have to exist in the property tree. By using the chart's JavaScript proxy object you can put data points directly into the chart, bypassing the property tree entirely.

This post has some more details.

1 Like

did you use the time series scatter plot graph and change the properties for the x axis to not be in a date format? could you show the props you used? I just dowloaded the module so not sure how to use the props.

The simplest way to get started is to use the Line item in the palette, then change the type to scatter.

Your data will go under data.datasets[i].data as {x, y} pairs.

I'd recommend reading through the Chart.js documentation site, they have a page with an example scatter chart.

I have a tag that is a dataset with 2 columns (my x and y values). Where would I do a tag binding to get these values in the scatter plot. I tried to bind it in data> datasets>0>data and the points don't pop up!

The component doesn't convert datasets for you, you'll have to use a transform to turn the rows of the dataset into {x, y} pairs.

hallo, i want to know how to import this module to our designer. may you can give the tutorial, thanks

Latest download is always on GitHub, look under the assets of the latest release.

Once downloaded, you can install it like any other Ignition module through the gateway UI.

2 Likes

Hey great work from you.
Last year I was also playing around with using Chart.js in Ignition and wanted to build a proper interface for it when i find the time. Guess you already did the work for me! :smiley:

1 Like

do you think you can provide an example?