Adding Plot Lines to Chart

Comments

6 comments

  • Avatar
    Adva Adva

    Hi,

    This is super cool!

    Is there a way to add plot lines when the X axis contains dates (rather than number values)?

     

    Thanks

    0
    Comment actions Permalink
  • Avatar
    Omer

    Hi Adva,

    It is possible by transforming the date column to a textual column, and then inserting the desired dates as values in the script.

     

    Regards,

    Omer

    0
    Comment actions Permalink
  • Avatar
    Adva Adva

    Ok thanks.

    0
    Comment actions Permalink
  • Avatar
    Juan Cieri

    Hello!

    Your example worked wonders for me, I thank you very much.

    But now I have a question, I have a widget with two combined graphs, that is, I have a range of days with graphs of columns and another one line graph that is showing me a percentile.

    So I want to apply the plot line, but it is shown in the position that is located at the 95% percentile. What would be the best way to do it?

    Beforehand thank you very much.

     

     

    0
    Comment actions Permalink
  • Avatar
    Shawn Springstead (Edited )

    I used this today and figured id share since I think my use case is very common.
    Sorry for formatting, I dont know how I'm supposed to make a code block, markdown dosnt seem to work.

     


    //create a red band from start to the current date to indicate late columns
    widget.on('beforeviewloaded', function(widget, ev){
      var today = moment().startOf('day')

      var endindex = ev.options.xAxis.categories.findIndex( (c) => {
        var d = moment(c, 'MM/DD/YY')
        return d >= today;
      })


      ev.options.xAxis.plotBands = [ {
        color: '#ffd8d8',
        from: -1,
        to: endindex >= 1 ? endindex - 1 : ev.options.xAxis.categories.length //If no idex was found then everything is late
      }];
    });

    This is for charts that display date on the x axis. It will highlight from the first value up to the latest date before 'today' so as to highlight values that are 'late'

    1
    Comment actions Permalink
  • Avatar
    M Shaw

    This is great thank you - is is possible to add another layer of complexity?

    Say for example we used the code above to add plot lines to create 4 quadrants for Boston box on revenue.
    Is is then possible to put a watermark behind each of the quadrants to help users understand.

    For example behind the upper right quadrant add a graphic for 'Love' In the Lower Right add a graphic for 'grow' etc?

    1
    Comment actions Permalink

Please sign in to leave a comment.