Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/371.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 无法在Chart.js中显示轴标签_Javascript_Chart.js - Fatal编程技术网

Javascript 无法在Chart.js中显示轴标签

Javascript 无法在Chart.js中显示轴标签,javascript,chart.js,Javascript,Chart.js,无法在Chart.js中显示轴标签。我看了文档,但似乎无法让标签真正显示出来 图表代码如下所示: <script src="http://www.chartjs.org/dist/2.7.2/Chart.bundle.js"></script> <canvas id="m-chart-562-1"></canvas> <script type="text/javascript"> new Chart( document.

无法在Chart.js中显示轴标签。我看了文档,但似乎无法让标签真正显示出来

图表代码如下所示:

<script src="http://www.chartjs.org/dist/2.7.2/Chart.bundle.js"></script>

<canvas id="m-chart-562-1"></canvas>    

<script type="text/javascript">
new Chart(
  document.getElementById('m-chart-562-1').getContext('2d'),
  {
        "type": "bar",
        "options": {
            "title": {
                "display": true,
                "text": "Test"
            },
            "legend": {
                "display": true,
                "position": "bottom"
            },
            "scales": {
                "xAxes": {
                    "scaleLabel": {
                        "display": true,
                        "labelString": "Horizontal Axis"
                    }
                },
                "yAxes": {
                    "scaleLabel": {
                        "display": true,
                        "labelString": "Vertical Axis"
                    }
                }
            }
        },
        "data": {
            "datasets": [{
                "label": "Number",
                "data": [10, 2, 7],
                "backgroundColor": "#7cb5ec"
            }, {
                "label": "Fatalities",
                "data": [5, 0, 1],
                "backgroundColor": "#434348"
            }],
            "labels": ["Cars", "Planes", "Boats"]
        }
    }
);
</script>

新图表(
document.getElementById('m-chart-562-1').getContext('2d'),
{
“类型”:“条”,
“选择”:{
“标题”:{
“显示”:正确,
“文本”:“测试”
},
“传奇”:{
“显示”:正确,
“位置”:“底部”
},
“天平”:{
“xAxes”:{
“scaleLabel”:{
“显示”:正确,
“标签串”:“水平轴”
}
},
“雅克斯”:{
“scaleLabel”:{
“显示”:正确,
“标签串”:“垂直轴”
}
}
}
},
“数据”:{
“数据集”:[{
“标签”:“编号”,
“数据”:[10,2,7],
“背景色”:“7cb5ec”
}, {
“标签”:“死亡事故”,
“数据”:[5,0,1],
“背景色”:“#434348”
}],
“标签”:[“汽车”、“飞机”、“船只”]
}
}
);
否则,图表渲染良好,但x/y轴均未显示我在设置中设置的轴标签

下面是一个JS小提琴,显示了相同的问题:

我的头撞了它一段时间了,非常感谢任何人能给我提供帮助。

只需在轴值上添加“[]”括号,如下代码:

"scales": {
                "xAxes": [{
                    "scaleLabel": {
                        "display": true,
                        "labelString": "Horizontal Axis"
                    }
                }],
                "yAxes": [{
                    "scaleLabel": {
                        "display": true,
                        "labelString": "Vertical Axis"
                    }
                }]
            }
检查链接:

哈。。。新的必须是简单的东西。非常感谢。