Home Forums Chart Support Y-Axis Minimum,Maximum and Interval Manual Plotting

Y-Axis Minimum,Maximum and Interval Manual Plotting

Viewing 7 posts - 1 through 7 (of 7 total)
  • #11601

    Hai,
    I have my own standardised logic for calculating the max,min and interval values for my graphs, but when i apply the same in canvas the max,min and interval values gets auto changed. Please let me know how to avoid the same.
    Sample:
    var chart = new CanvasJS.Chart(“chartContainer”, {
    title:{
    text: “Plotting Interval Issue in CanvasJS”
    },
    data: [
    {
    // Change type to “doughnut”, “line”, “splineArea”, etc.
    type: “column”,
    axisY:{
    minimum: -2100,
    maximum: 10236,
    interval: 3003,
    },
    dataPoints: [
    { label: “apple”, y: 8897.10 },
    { label: “orange”, y: 2608.39 },
    { label: “banana”, y: -2088.73 },
    { label: “mango”, y: 1971.12 },
    { label: “watermelon”, y: 1971.12 },
    { label: “grape”, y: 138.52 },
    { label: “carrot”, y: -615.21 },
    { label: “lemon”, y: -991.10 }
    ]
    }
    ]
    });

    chart.render();

    #11603

    Muralimnmcse,

    axisY is attributes of Chart options. But you seem to be passing axisY options to dataSeries instead of chart. Passing it inside chart-options should work fine in this case. Please find the code-snippet below.

    var chart = new CanvasJS.Chart("chartContainer", {
      title:{
      text: "Plotting Interval Issue in CanvasJS"
      },
      axisY:{
        minimum: -2100,
        maximum: 10236,
        interval: 3003,
      },
      data: [
        {
        // Change type to "doughnut", "line", "splineArea", etc.
        type: "column",
          dataPoints: [
            { label: "apple", y: 8897.10 },
            { label: "orange", y: 2608.39 },
            { label: "banana", y: -2088.73 },
            { label: "mango", y: 1971.12 },
            { label: "watermelon", y: 1971.12 },
            { label: "grape", y: 138.52 },
            { label: "carrot", y: -615.21 },
            { label: "lemon", y: -991.10 }
          ]
        }
      ]
    });
    
    chart.render();

    Please take a look at this JSFiddle for complete code.
    Chart with Custom Axis Range & Interval


    Sanjoy

    #11637

    Hi Sanjoy,

    I don’t have problem in data loading, the issue is with the plotting intervals,
    Sample:
    var chart = new CanvasJS.Chart(“chartContainer”, {
    title:{
    text: “Plotting Interval Issue in CanvasJS”
    },
    axisY:{
    minimum: -109,
    maximum: 60,
    interval: 42.25
    },
    data: [
    {
    // Change type to “doughnut”, “line”, “splineArea”, etc.
    type: “column”,
    dataPoints: [
    { label: “apple”, y: 51.9 },
    { label: “orange”, y: 7.75 },
    { label: “banana”, y: 5.07 },
    { label: “mango”, y: 2.59 },
    { label: “watermelon”, y: 2.58 },
    { label: “grape”, y: 1.09 },
    { label: “carrot”, y: 0.04 },
    { label: “lemon”, y: -0.01 },
    { label: “jackfruit”, y: -0.01 },
    { label: “custardapple”, y: -0.02 },
    { label: “butterfruit”, y: -29.11 },
    { label: “jackfruit”, y: -94.29 }
    ]
    }
    ]
    });

    chart.render();

    In the above sample the canvasjs automatically changes my max,min and intervals and the plotting intervals are -84.5,-42.25,0,42.25 but it should have been -109,-66.75,-24.5,17.75,60.

    #11639

    Sorry Muralimnmcse,

    In the code that you have shared, you are setting minimum & maximum, which sets the range of the axis. Setting minimum of the axis just defines the range of axis but doesn’t let you control the start position of the labels. Also, it’s not possible to control the starting point of the label as of now.


    Sanjoy

    #11640

    Sanjoy,

    Thanks for your quick update, request you to keep me posted in this regards.

    #19656

    Hi

    Is it possible to dynamically change the axisY minimum value so that it is always the lowest y value? The example chart is https://negotiation.azurewebsites.net/helloworld.php. In this case I want the axisY minimum to be the lowest y value

    Thanks

    #19657

    @reusen,

    Yes, you can set axisY minimum to the lowest y-value. You can achieve that by finding the lowest y-value and changing axisY minimum using set method. Please take a look at this JSFiddle.
    setting y axis minimum


    Vishwas R
    Team CanvasJS

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

You must be logged in to reply to this topic.