我正在使用Django,并在如下视图中显示条形图:
index.html
<script>
$(document).ready(function(){
var ctx = document.getElementById('pollingBarChart');
var myChart = new Chart(ctx, {
type: 'bar',
data: {
labels: [{% for c in categories %}"{{ c.name }}",{% endfor %}],
datasets: [{
label: '# of Votes',
data: [{% for a in active_votes %}
{{ a }},
{% endfor %}],
}]
},
options: {
scales: {
yAxes: [{
ticks: {
beginAtZero: true,
fontColor: 'white',
callback: function(value) {if (value % 1 === 0)
{return value;}}
}
}],
xAxes: [{
ticks: {
fontColor: 'white',
fontSize: 12,
}
}],
},
legend: {
labels: {
fontColor: 'white'
},
},
}
});
});
</script>
我想出了可以将xAxes-> ticks-> fontSize设置为0来实现所需功能的方法,但是我无法弄清楚如何使用以下方法将该值更改为0媒体查询。
我仍在学习JavaScript,因此不确定最佳方法。我发现的一种可能性是使用window.matchMedia("(max-width: 756px)")
并添加一个侦听器。但是我无法使其正常工作。
任何帮助将不胜感激。谢谢。