使用媒体查询从Chart.js中删除标签(或更改选项值)

问题描述 投票:0回答:1

我正在使用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)")并添加一个侦听器。但是我无法使其正常工作。

任何帮助将不胜感激。谢谢。

javascript django chart.js
1个回答
1
投票
© www.soinside.com 2019 - 2024. All rights reserved.