Chart.js图表​​格式-图例和Y轴和标题

Question

已解决

解决方案：将axis的拼写更改为axes

我刚刚开始使用Chart.js作为Python Plot.ly库的替代方法。 到目前为止，我已经能够按照自己想要的方式格式化图表，但是仍然有一些细微之处我无法理解。

首先，我无法在Y轴值之前添加$的任何解决方案。 这是我的图表，其后是该图表的代码：

<script>
    var ctx = document.getElementById("myChart").getContext('2d');
    var months = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];
    var O1 = [1000,2000,3000,4000,5000,6000,7000,8000,9000,10000,11000,12000];
    var O2 = [3000,6000,5000,3000,8000,6000,4000,7000,8000,0000,3000,1000];

    var mychart = new Chart(ctx, {
        type: 'line',
        options: {
            title:{
                text: 'Test Chart',
                display: true,
                fontStyle: 'bold',
                fontSize: 16,
            },
            legend:{
                position: 'right',
            },
            scales:{
                yAxis:[{
                    scaleLabel:{
                        display: true,
                        labelString: 'Tester',
                    },
                    ticks:{
                        callback: function(value, index, values) {
                            if(parseInt(value) >= 1000){
                                return '$' + value.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
                            } else {
                                return '$' + value;
                            }
                        }
                    }
                }]
            },
            tooltips:{
                callbacks: {
                    label: function(tooltipItem, data){
                        var dataLabel = data.labels[tooltipItem.index];
                        var value = ': $ ' + data.datasets[tooltipItem.datasetIndex].data[tooltipItem.index].toLocaleString();
                        if (Chart.helpers.isArray(dataLabel)) {
                            dataLabel = dataLabel.slice();
                            dataLabel[0] += value;
                        } else {
                            dataLabel += value;
                        }
                        return dataLabel1;
                    }
                }
            }
        },
        data: {
            labels: months,
            datasets: [
                {
                label: 'Officer1',
                data: O1,
                fill: false,
                backgroundColor: 'rgba(255, 99, 132)',
                borderColor: 'rgba(255, 99, 132)',
                },
                {
                label: 'Officer2',
                data: O2,
                fill: false,
                backgroundColor: 'rgba(0,0,255)',
                borderColor: 'rgba(0,0,255)',
                }
            ]
        }
    });
</script>

您可能会看到，我只想在我的Y轴数据值之前添加一个$。我尝试的最后一个解决方案也将数据破坏了1000倍。

其他：

我遇到的下几个问题非常小，这就是为什么我选择将它们包括在这里。

首先，我想使用一种方法将标题放在图表本身的中心，而不是在整个图表+传奇项目的中心。

第二，我想在图例的左侧添加一些空间，以便将其与图表分开。

最后，我的Y轴标题将不会显示。我希望它在我进行即时测试时显示在这里，以备将来使用。 此问题已通过将axis的拼写更改为axes ...精妙

Answer 1

将axis的拼写更改为axes