Knowledge Base Article

Sort Both Axes In Scatter Chart

In order to sort both axes in the Scatter chart you might need to use the following script under the "Widget Script" level
 
var xOrder = 'asc' //also, this value can be desc
var yOrder = 'asc'

widget.on('beforeviewloaded', function(scope, args) {
    var shouldBeExecuted = (order === 'desc' || order === 'asc' )
    if (args.widget.type !== 'chart/scatter' || !shouldBeExecuted) {
        return
    }

    var daysOrder = args.options.xAxis.categories.sort();
    if (xOrder === 'desc') {
        daysOrder.reverse()   
    }


    if (daysOrder.length === args.options.xAxis.categories.length) {
        args.options.xAxis.categories = daysOrder
        for (i=0; i<daysOrder.length; i++) {
            for (k=0; k<args.options.series.length; k++) {
                for (j=0; j<args.options.series[k].data.length; j++) {                    
                    if (args.options.series[k].data[j].selectionData[0] === daysOrder[i]) {
                        args.options.series[k].data[j].x = i;
                    }
                }
            }
        }
    }
})


widget.on('beforequery', function(se, ev) {
    ev.query.metadata.forEach(function(m) {
        if (m.wpanel && m.wpanel === 'y-axis') {
            m.jaql.sort = yOrder
        }
    })
})
 

 

 
Updated 06-02-2025

5 Comments

  • Thanks! How would I do this if I wanted to do a custom sort? For example, the ascending and descending order alphabetically don't achieve what I want, and I want the order to specifically be a,c,b,d.

  • I'm hoping this script will work for me, but it isn't yet...

    Without a script, the x-axis dates are in order and the y-axis dates are out of order. This is because for a given data point associated with the earliest/leftmost date on the x-axis, it's then sorting the y-axis by the order in which the data points are associated with the x-axis dates. It's just sorting the y-axis within the x-axis labels. 05/2019 and 01/2020 on the y are sorted within 01/2020 on x, but then 01/2012 and 02/2020 are next on y, sorted within 02/2020 on x.

    Using the script above, it sorts the y-axis, but then the x-axis goes out of order because of the same problem in reverse.

     

    • DRay's avatar
      DRay
      Admin

      Hi wallingfordce​,

      Sorry I didn't see this sooner. I'm asking internally for someone to look at this and provide updated code.

      • While I have you... or when you're back... I noticed all the images are gone from my earlier comments. Are they gone with the recent changes to the community platform?