Home forums Using CanvasJS Line chart with data points at axis maximum

This topic contains 7 replies, has 3 voices, and was last updated by  cfaribault 3 years, 3 months ago.

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #4841

    kgarvey
    Participant

    If I have a line chart showing % values (Y) for certain x values, with the Y axis maximum set to 100, any point with a Y value of 100 has its indicator cut off. Same goes for a Y value of 0, and the maximum and minimum X values, too.

    Is there a way to allow the indicators to display beyond the an axis’s maximum value?

    #4842

    Sunil Urs
    Keymaster

    Chart clips anything that goes outside of axis’s maximum/minimum. So in cases where markers at the boundaries are getting clipped, here is what I would do.

    axisY:{
            maximum: 103,
            lineThickness: 0
          }

    This will slightly increase the axis range but will not show any label at the end – which gives an impression that 100 is the maximum range of chart.


    Sunil Urs

    #4844

    kgarvey
    Participant

    Ah, I see. Okay, thanks!

    #5197

    cfaribault
    Participant

    Hi,

    I have an issue somewhat related to this. I have a chart that displays money amounts (Y axis) for different days of the month (X axis). Amounts can be positive as well as negative. I do set minnimum and maximum values on the Y axis to match the min/max amount of the month, but when doing so I loose the Y axis line at 0$. Any suggestion as to how to get it back when negative/positive ranges are different?

    Thanks!

    #5203

    Sunil Urs
    Keymaster

    cfaribault,

    Did you mean to say you are loosing Y Axis line or Grid Line at $0. If you meant grid lines, you can try setting interval for Y Axis – try using numbers like 5, 10, 50, 100, etc so that it becomes easier to read values. If I understood it wrong, can you please create jsfiddle so that I can understand it better.


    Sunil Urs

    #5208

    cfaribault
    Participant

    Hi Sunil,

    You did understand correctly, unfortunately setting an interval value isn’t enough. You can see it here:

    http://www.mybudgetonline.com/mybo/budget/calendar

    Thanks!

    Chris

    #5209

    Sunil Urs
    Keymaster

    Chris,

    By default CanvasJS calculates intervals which are multiples of 1, 2, 5, 10, etc. Hence if the ranges that you specify is not a multiple of these values, you might miss out the 0 line.

    So, even if you specify these values yourself, you’ll have to specify minimum & maximum such that the range (maximum – minimum) is a multiple of interval – this will solve the problem. Otherwise mathematically it is not possible to include 0.

    May I know why you are setting custom minimum/maximum values?? If I know this I can probably suggest you a better alternative.


    Sunil

    #5211

    cfaribault
    Participant

    Hi Sunil,

    I found out about min/max values before interval. I’ve done some more tests and using only interval seems to be the best way to go. I calculate a custom interval based on min/max values and it looks just like I want it.

    http://mybudgetonline.com/mybo/budget/calendar?_=1378124457

    Thanks for making me realize the uselessness of setting min/max values in this case! 🙂

    Chris

Viewing 8 posts - 1 through 8 (of 8 total)

You must be logged in to reply to this topic.