Home Forums Chart Support Formatting charts & markers

Formatting charts & markers

Viewing 3 posts - 1 through 3 (of 3 total)
  • #24979

    I’m new to canvasjs and have been working with scatter plots for a couple weeks now. I’m using customization for charts and datapoints and not sure which customization I’m using that’s causing the charts to look different.
    These two charts have the same customization (chart height, width and data point marker size, and interval) but the format changes when the number of data points change. Most notably, with the fewer data points, the markers don’t start on the x axis – they start plotting a bit above the axis. Also note the space between each marker that exists with low number of data points that does not exist when the numbers get larger. Finally, the top data point is much taller than the other data points.
    few datapointsmany data points


    Here are my current customizations:
    backgroundColor: “#99FAFB”,
    width: 350,
    height: 600,
    dataPointWidth: 40,
    title: {
    text: “NWEA Summer Learning Loss: Math”
    axisX: {
    title: “Current Grade Level”,
    interval: 1
    axisY: {
    title: “# of Students”,
    suffix: “”
    legend: {
    cursor: “pointer”,
    itemclick: toggleDataSeries
    dataPointMinWidth: 40,
    data: [{
    type: “scatter”,
    name: “75-99%”,
    showInLegend: true,
    markerType: “square”,
    markerBorderThickness: 1,
    markerBorderColor: “black”,
    markerColor: “black”,
    markerSize: 40,

    <body><div id=”RedchartContainer” style=”height: 600px; max-width: 920px; margin: 0px auto;”></div>



    Can you kindly create a JSFiddle with sample data, so that we can understand the use case better and help you out?

    Shashi Ranjan
    Team CanvasJS

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

You must be logged in to reply to this topic.