Home forums Using CanvasJS How to control padding of plotted data

This topic contains 2 replies, has 2 voices, and was last updated by  ynotravid 3 months ago.

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #22247

    ynotravid
    Member

    Hi, how can I control how much space there is between the data and the edge of the plotting area?

    I have looked through all the properties and methods but the closest I have found is the axis viewPortMinimum/Maximum. Which seems to be more oriented toward clipping data rather than what I’m looking for.

    tl;dr
    I have two charts above and below. On both charts I am plotting a day’s worth of data. I would like the data to line up between the top and bottom chart but for some reason the top chart has no padding on the plotted data but the bottom chart does.

    Both charts are plotting data for the same time window but one chart has many more data points (15 minute sample vs 1 hour sample rate).

    Thanks ahead of time!

    #22252

    Priyanka M S
    Member

    @ynotravid,

    You can use the property viewPortMinimum/ viewPortMaximum to control the space between the axis and the first dataPoint.
    However, it would be easy for us to understand your requirement better with an example. Kindly create and share a jsfiddle representing the issue you are facing.

    __
    Priyanka M S
    Team CanvasJS

    #22268

    ynotravid
    Member

    Hi Priyanka, sorry I misunderstood the description of these properties. Initially when I went to test these properties I had issue trying to use date for min and max. switching to timestamp resolves that issue.

    In case someone comes accross this, here is a working fiddle

    fiddle showing different margins for different data:
    https://jsfiddle.net/mLgbxrnf/

    Issue resolved using viewPortMinimum / viewPortMaximum:
    https://jsfiddle.net/jmw2xL36/

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

You must be logged in to reply to this topic.