我使用Chart.js制作了一个图表,但该图表可以正常工作,但是我搜索设置最小值(例如0),但我做不到。
我的代码:
blocks
我尝试过这个:
<script type="text/javascript">
var NbCanvas = document.getElementById("NbTicketsChart");
Chart.defaults.global.defaultFontFamily = "Lato";
Chart.defaults.global.defaultFontSize = 18;
var densityData = {
label: 'Nombre de tickets sur la semaine',
data: [20, 25, 30, 25, 30, 35, 40],
backgroundColor: '#336ca6'
};
var barChart = new Chart(NbCanvas, {
type: 'bar',
data: {
labels: ["J-1", "J-2", "J-3", "J-4", "J-5", "J-6", "J-7"],
datasets: [densityData],
options:{
scales: {
yAxes : [{
ticks : {
max : 100,
min : 0
}
}]
}
}
}
});
</script>
感谢您的阅读! 亚瑟
答案 0 :(得分:1)
这让我很沮丧。根据文档,您的方法似乎应该起作用。我只能通过在创建图表后设置比例来使其正常工作,如下所示:
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.bundle.min.js"></script>
<canvas id="NbTicketsChart" width="50" height="50"></canvas>
<script>
var NbCanvas = document.getElementById("NbTicketsChart");
Chart.defaults.global.defaultFontFamily = "Lato";
Chart.defaults.global.defaultFontSize = 18;
var densityData = {
label: 'Nombre de tickets sur la semaine',
data: [20, 25, 30, 25, 30, 35, 40],
backgroundColor: '#336ca6'
};
var barChart = new Chart(NbCanvas.getContext('2d'), {
type: 'bar',
data: {
labels: ["J-1", "J-2", "J-3", "J-4", "J-5", "J-6", "J-7"],
datasets: [densityData]
}});
barChart.options.scales.yAxes[0] = {ticks: {min: 0, max: 100, stepValue: 20}}
</script>
在发布此内容时,我还注意到当画布尺寸为400 x 400时,它不起作用。50x 50似乎可以工作...
答案 1 :(得分:0)
class ShowData extends StatelessWidget {
final String title;
ShowData({this.title});
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
backgroundColor: Colors.blue,
title: Text(title),
)
);
}
}