CODEWITHSUNDEEP
javascriptchartszingchart
Spiff
Spiff

Reputation: 4104

ZingChart display multiples of a value in x-axis

Suppose I have in x-axis with values from 0 to 2049. My values are series. What I would have to do to display only 0,500,1000,1500,2000, i.e. every other 500 tick mark, I haven't found an example yet. I tried max-labels but because my values are more than 2000, i don't get multiples of 500. Is there a way to achieve this?

Upvotes: 2

Views: 245

Answers (1)

nardecky
nardecky

Reputation: 2631

You have scale-x, did you mean scale-y?

If you are talking about scale-y you can set the minValue, maxValue and step between the scales. You can set those all individually or you can set them like values: 'minValue:maxValue:step'. itemsOverlap just forces all items to render, even if their height or width overlaps an item above or below it.

var myConfig = {
 	type: 'bar', 
 	scaleY: {
 	  values: '0:2000:500',
 	  maxItems: 5,
 	  itemsOverlap: true,
 	},
	series: [
		{
			values: [2235,4442,3367,1389,2325,3334,4567,2385]
		}
	]
};

zingchart.render({ 
	id: 'myChart', 
	data: myConfig, 
	height: '100%', 
	width: '100%' 
});
html, body {
	height:100%;
	width:100%;
	margin:0;
	padding:0;
}
#myChart {
	height:100%;
	width:100%;
	min-height:150px;
}
.zc-ref {
	display:none;
}
<!DOCTYPE html>
<html>
	<head>
		<script src= "https://cdn.zingchart.com/zingchart.min.js"></script>
	</head>
	<body>
		<div id="myChart"><a class="zc-ref" href="https://www.zingchart.com">Powered by ZingChart</a></div>
	</body>
</html>

If this is answer is not what you are looking for, please notify.

Scales documentation:

https://www.zingchart.com/docs/tutorials/chart-elements/configure-chart-scales/

https://www.zingchart.com/docs/api/json-configuration/graphset/scale-x/

Upvotes: 4

Related Questions