Modify a list dates

Need help Plugins
1

Hello,

Hope somebody is facing a similar issue and could help me out.

I need to display hundreds of points in a chart. Problem is chart x-axis clutters witl all dates. So idecided to use toolbox to modify the array of dates in a custom state list of dates. I asked chatgpt to help me out creatin a code that will create a second date list with same number of dates objects but will only copy 5 dates for all the range so i wont have to display every single date on the chart.

image
image332×596 13 KB

image
image318×571 14.1 KB

function transformarFechas(listaFechas) {
    //If list has less than 5 elements, copy all
    if (listaFechas.length <= 5) {
        return listaFechas;
    } else {
        // Take first date
        let fechasTransformadas = [listaFechas[0]];
        // Copy 3 intermediate date if posible
        for (let i = 1; i <= 3; i++) {
            let index = Math.floor((i / 4) * (listaFechas.length - 1));
            fechasTransformadas.push(listaFechas[index]);
        }
        // Take last date
        fechasTransformadas.push(listaFechas[listaFechas.length - 1]);
        // fill with undefined rest of positions
        for (let i = 5; i < listaFechas.length; i++) {
            fechasTransformadas.push(undefined);
        }
        return fechasTransformadas;
    }
}

// Example of use
const listaOriginal = [new Date("2024-01-01"), new Date("2024-02-02"), new Date("2024-03-03"), new Date("2024-04-04"), new Date("2024-05-05"), new Date("2024-06-06")];
const listaTransformada = transformarFechas(listaOriginal);
console.log(listaTransformada);

I have the folowing error:

image
image1208×96 6.26 KB

Any hint on the problem? Could be the code wrong in someway?

Im I missin a parameter in Air Line Chart Lite that could help me out?

Thank you

2

Is your ultimate goal to take only 5 dates from a list of dates so as to not have as much clutter on the x-axis?

Or is your ultimate goal to have the same number of dates on the x-axis but have them be duplicates of just 5 dates?

Or are you trying to create a range of dates from a set of 5 dates that were in your original list of dates?

3

Is your ultimate goal to take only 5 dates from a list of dates so as to not have as much clutter on the x-axis?

Yes you got it , i need to display 5 or less dates on charts to avoid cluttering. For this to work i need to create a list of dates with the exact number of chart points because charts will display a x value for every -y- value. Only 5 readable dates will be in the list , the other ones will be replaced by null so they wont show.

End goal is to chart hundreds of points but only showing 5-6 dates on them, distributed at equal distance among them.

Any idea how can i accomplish this?

4

If the purpose is to not clutter the x-axis with too many date values, I think you could try to find a way to collapse and hide the date value itself, but I don’t know if the chart plugins allow for that.

I personally do not know how it would be possible to keep all the necessary data displayed while not removing date values or changing the way the associated data is displayed if you also need to keep the same number of chart points.

One alternative is to reduce the number of chart points and use a wider range of dates for each chart point.

5

If the purpose is to not clutter the x-axis with too many date values, I think you could try to find a way to collapse and hide the date value itself, but I don’t know if the chart plugins allow for that.

The thing about this chart plugins is that they aren’t as customizable , you just feed them with a list of time series data, and they plot it, date list need to be the same length as data list. So far, i ran the javascript code on another code compiler and it works good. It creates a list of dates the same length of the original list and sets to undefined the dates i dont want to show.

I believe there is something wrong with the javascript toolbox or the way bubble store the dates in javascript variable but can’t be sure. I will try other charts plugin to see if the have a parameter to do this.

6

Could be with the chart element not allowing for it.

If you are good enough with javascript to do the list of dates stuff, you could just make your own chart.

1 Like
7

I’ll see what i can do and keep pecking :slight_smile: . The Apex chart plugin does not clutter all x values. It keeps them one next to the other. I believe i saw an option to limit x values on apex web page, but couldn’t make it work on bubble. I have managed to add options for the user to only see values for last hour, day and week, but i still need to show all values if needed.

image
image620×671 178 KB

You can see the big difference, bubble chart plugin cant handle many y/x values.

Regards