Possible get more modern looking charts?

Hello All,
We have been working on a few modules lately, one of them being an Apex Charts module. We have been using this module for certain clients for the last few months, and in a few home automation systems, mine included. We will be releasing the source code for these modules in the coming weeks, just working on a website and the github. Commercial support is also available through an integration partner.

There are a few variants in the component tree already, and I can answer any questions and provide some further examples as required.

I can not post uploads with a new account, so please message me directly if interested and I will send you the module.

Thanks!

Below is an example screen. All of these charts are built using the module.

7 Likes

Is this for Perspective or Vision?

Maker, so Perspective

Correct, this is for Perspective. It works with both Maker and non Maker licenses

Here is a link to the module, for those interested.
https://epgcfa0dnqmdmzu7gcoipm1alma.s3.us-west-2.amazonaws.com/ApexCharts-b2021072114.modl

5 Likes

Thanks!

The simple charts you made can you share that project on the exchange? Your charts on the right are exactly what I want. I tried going to the apex sight to reproduce, but your module had to move some things to get it to work (JavaScript Stacked Area Chart Sample – ApexCharts.js)

Or could you even paste in to the forum.

In addition, I tried going to your website to read the license agreement and it was not up. (http://www.kyvislabs.com/)

Excellent job, and this is a really nice module.

1 Like

The website is not active yet, and we will be providing examples and have component variants built in by default in a coming version of the module.

1 Like

We have fixed a couple of bugs with the ApexCharts module, you can download the new one here:

https://epgcfa0dnqmdmzu7gcoipm1alma.s3.us-west-2.amazonaws.com/ApexCharts-b2021081816.modl

Changes:

  • Fixed issue with pie charts and radial bar
  • Added pie chart variant
  • Added chart events object to variants with all events set to false or disabled. Simply set to true to enable and add script in event handler.
4 Likes

How can I change the color of the graphics?

Can you be a bit more specific?

1 Like

For example the blue color of this graph change it to green

Yes, you just need to add a colors array to the options property. See the documentation here:

https://apexcharts.com/docs/options/colors/

Every property is available to set from their documentation.

1 Like

@kyvislabs
Just starting to use this, looks really good so far!

Quick questions:
1) I’m getting data from a tag history binding, and timestamps are therefore unix epoch timestamps. How would I display these as date times? I’ve tried setting options.xaxis.type to datetime but nothing happened
The labels themselves show fine in the tooltip, but not on the chart when made visible

This one works now… the Designer version doesn’t seem to always repaint when options are changed.

2) How would I show labels for particular dates/times instead? e.g. only show labels for every hour or every 6 hours?
I set the xaxis.format to HH:mm and this has done this for me, and added the date when the midnight crossovers occur which is super cool.

Nevermind my questions… :sweat_smile:

@kyvislabs - Any chance you could share the license agreement even if the website isn’t ready yet? I can’t install this module on company resources until we fully understand the licensing agreement implications.

1 Like

I run it on my personnel maker server at home to test it out why I am waiting for @kyvislabs to make the license available. I wish ignition would make this one added to perspective.

The other way to do this is use the webdev module. This will allow you to use charts.js or apex.js. You have to use python to build the website, but it makes for a really responsive and cool charts. You can then use iFrames to embed the page into another page. The ability to be persistent or have the charts interact back with ingition is a littel tougher.

But you have to add $1600 for web dev module which unacceptable and also the management of code is very hard

1 Like

We have a nodejs module instead.

How does it work here?
And how much does it cost?

I will soon release a video on it.

1 Like