Now that the aspect ratio is correctly handled, fix samples for charts with aspect ratio of 1 which was vertically too large. Also fix the default aspect ratio for radar charts which wasn't applied when creating a chart directly using new Chart(ctx, { type: 'radar' }).
</head>
<body>
- <div id="canvas-holder" style="width:75%">
+ <div id="canvas-holder" style="width:40%">
<canvas id="chart-area" />
</div>
<button id="randomizeData">Randomize Data</button>
</head>
<body>
- <div id="canvas-holder" style="width:75%">
+ <div id="canvas-holder" style="width:40%">
<canvas id="chart-area"></canvas>
</div>
<button id="randomizeData">Randomize Data</button>
</head>
<body>
- <div style="width:75%">
+ <div style="width:40%">
<canvas id="canvas"></canvas>
</div>
<button id="randomizeData">Randomize Data</button>
</head>
<body>
- <div style="width:75%">
+ <div style="width:40%">
<canvas id="canvas"></canvas>
</div>
<button id="randomizeData">Randomize Data</button>
module.exports = function(Chart) {
Chart.Radar = function(context, config) {
- config.options = Chart.helpers.configMerge({aspectRatio: 1}, config.options);
config.type = 'radar';
return new Chart(context, config);
var helpers = Chart.helpers;
Chart.defaults.radar = {
+ aspectRatio: 1,
scale: {
type: 'radialLinear'
},