Home Forums Chart Support minimum and maximum scatter chart issues

minimum and maximum scatter chart issues

Viewing 5 posts - 1 through 5 (of 5 total)
  • #39164

    As per attached in the screenshot below
    Screenshot image

    The edges here are not selectable, they are only half as you can see. How can i do it so these are full circles and therefore selectable?
    I had selected as the axis the minimum and the maximum so it scales correctly. But then i have this issue. Is their anyway i can fix this or avoid this.

    Thanks

    #39180

    var chart = new CanvasJS.Chart(“chartContainer1”,
    {
    title:{
    text: “Basic Scatter Chart”
    },

    axisX:{
    minimum: -1,
    maximum: 50
    },
    data: [
    {
    type: “scatter”,
    dataPoints: [
    { y: 23, x: 0 },
    { y: 54, x: 1 },
    { y: 10, x: 2 },
    { y: 42, x: 1 },
    { y: 50, x: 50 }

    ]
    }
    ]
    });
    chart.render();

    #39182

    @pfiasco,

    When axis minimum and maximum are set, the datapoints that are present either outside or nearer to the set range will get clipped. You can either decrease or increase the range to show datapoints without getting them clipped. In your case, setting maximum to 51 seems to be working fine. Please find the code snippet below.

    axisX: {
      minimum: -1,
      maximum: 51
    }

    Please check this JSFiddle for a working example.


    Thangaraj Raman
    Team CanvasJS

    #39183

    So basically your saying we should never set the minimum and maximum according to the data given otherwise it wont show properly.
    So in theory always such as -10% and +10% of the data given so we never get it clipped? Both on the x and y axis right?

    #39195

    @pfiasco,

    The datapoint will be positioned exactly on the x and y coordinate that was passed. However, the size of the marker used to represent a particular datapoint can vary based on it’s size. For example: in your code, the last datapoint is { y: 50, x: 50 }, hence the center of the marker will be positioned on the coordinate { y: 50, x: 50 } and since you are setting axisX maximum to 50, only half the marker will be visible while the other half gets clipped. You will have to set axis maximum and minimum accordingly such that the entire datapoint can be accommodated within the plot area.


    Thangaraj Raman
    Team CanvasJS

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

You must be logged in to reply to this topic.