chartist icon indicating copy to clipboard operation
chartist copied to clipboard

Chart is not filling div width

Open rotaercz opened this issue 7 years ago • 2 comments

Hi, I have a stacked bar chart with one horizontal bar. How can I get the chart to fill the whole width of the div? This is the code I have:

var data = {
	series: [
		[5],
		[10],
		[3],
		[0],
		[2],
		[7],
		[6]
	]
};

var options = {
	stackBars: true,
	horizontalBars: true,
	axisX: {
		showGrid: false,
		showLabel: false,
		offset: 0
	},
	axisY: {
		showGrid: false,
		showLabel: false,
		offset: 0
	},
	chartPadding: 0,
}

var c = new Chartist.Bar('.ct-chart', data, options).on('draw', function(data) {
	if(data.type === 'bar') {
		data.element.attr({
			style: 'stroke-width: 31px'
		});
	}
});

rotaercz avatar Jul 17 '17 02:07 rotaercz

I answered something similar on StackOverflow. It might help. https://stackoverflow.com/questions/40697145/chartist-js-bar-chart-fill-axis

traviss0 avatar Nov 09 '17 08:11 traviss0

Hello @rotaercz 👋

Chartist has recently been updated to version 1.0 with some new exciting changes like ESM and TypeScript support. The migration guide can be found right here.

Please let me know if the question is still relevant to you so we can further look into it!

Arantiryo avatar Nov 03 '22 12:11 Arantiryo