FORUMS

Select any forum below to ask question

Home › Forums › Report Bugs › dataPointMaxWidth is ignored when using multiple data sets

dataPointMaxWidth is ignored when using multiple data sets

Viewing 2 posts - 1 through 2 (of 2 total)
  • December 13, 2016 at 2:05 pm #13628

    Hannah

    When you have multiple sets of column data, setting dataPointMaxWidth is ignored, and max width scaling never exceeds a predetermined value.

    Setting dataPointMinWidth makes each data column wider, but users must know the size of the canvas element.

    Scaling several small columns on wider graphs should be up to the full value of dataPointMaxWidth, it seems to stop scaling when the value reaches 110 (the max combined width all columns for a data point) and users are left with lots of whitespace either side of the columns.

    An example, the first shows where the max width is. The second shows how increasing the dataPointMaxWidth value has no impact.

    <!DOCTYPE HTML>
<html>
<head>
<script src="https://cdn.canvasjs.com/canvasjs.min.js"></script>
<script type="text/javascript">

window.onload = function () {
	var chart = new CanvasJS.Chart("chartContainer", {
        dataPointMaxWidth:11,
		data: [              
		{
			type: "column",
			dataPoints: [
				{ label: "apple",  y: 10  }
			]
		},
        {
			type: "column",
			dataPoints: [
				{ label: "apple",  y: 10  }
			]
		},
        {
			type: "column",
			dataPoints: [
				{ label: "apple",  y: 10  }
			]
		},
        {
			type: "column",
			dataPoints: [
				{ label: "apple",  y: 10  }
			]
		},
        {
			type: "column",
			dataPoints: [
				{ label: "apple",  y: 10  }
			]
		},
        {
			type: "column",
			dataPoints: [
				{ label: "apple",  y: 10  }
			]
		},
        {
			type: "column",
			dataPoints: [
				{ label: "apple",  y: 10  }
			]
		},
        {
			type: "column",
			dataPoints: [
				{ label: "apple",  y: 10  }
			]
		},
        {
			type: "column",
			dataPoints: [
				{ label: "apple",  y: 10  }
			]
		},
        {
			type: "column",
			dataPoints: [
				{ label: "apple",  y: 10  }
			]
		}
		]
	});
	chart.render();
}
</script>
</head>
<body>
<div id="chartContainer" style="height: 300px; width: 100%;"></div>
</body>
</html>
    <!DOCTYPE HTML>
<html>
<head>
<script src="https://cdn.canvasjs.com/canvasjs.min.js"></script>
<script type="text/javascript">

window.onload = function () {
	var chart = new CanvasJS.Chart("chartContainer", {
        dataPointMaxWidth:100,
		data: [              
		{
			type: "column",
			dataPoints: [
				{ label: "apple",  y: 10  }
			]
		},
        {
			type: "column",
			dataPoints: [
				{ label: "apple",  y: 10  }
			]
		},
        {
			type: "column",
			dataPoints: [
				{ label: "apple",  y: 10  }
			]
		},
        {
			type: "column",
			dataPoints: [
				{ label: "apple",  y: 10  }
			]
		},
        {
			type: "column",
			dataPoints: [
				{ label: "apple",  y: 10  }
			]
		},
        {
			type: "column",
			dataPoints: [
				{ label: "apple",  y: 10  }
			]
		},
        {
			type: "column",
			dataPoints: [
				{ label: "apple",  y: 10  }
			]
		},
        {
			type: "column",
			dataPoints: [
				{ label: "apple",  y: 10  }
			]
		},
        {
			type: "column",
			dataPoints: [
				{ label: "apple",  y: 10  }
			]
		},
        {
			type: "column",
			dataPoints: [
				{ label: "apple",  y: 10  }
			]
		}
		]
	});
	chart.render();
}
</script>
</head>
<body>
<div id="chartContainer" style="height: 300px; width: 100%;"></div>
</body>
</html>
    December 15, 2016 at 10:24 am #13646

    Vishwas R

    [update]

    We have just released v1.9.6 Beta with Methods & Properties, which allows you to programmatically access internally calculated values, export chart as image, print chart, etc. Please refer to the release blog for more information.

    Hannah,

    dataPointMaxWidth sets the maximum width of dataPoints which means the auto-calculated width of each column can reach upto the specified dataPointMaxWidth and shouldn’t cross that limit. You can use dataPointWidth to set width of column.

    —
    Vishwas R
    Team CanvasJS

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

You must be logged in to reply to this topic.