javascript - 最后一个值未显示在 charts.js-library 的条形图中

标签 javascript jquery html css chart.js

我创建了一个条形图,但我只看到我创建的 6 个标签中的 5 个值。即使在 charts.js website 上,他们使用的条形图示例仅显示了 7 个创建的标签中的 6 个值。

我的代码

'use strict'

$(function () {
var data = {
  labels: ["HTML", "CSS", "JavaScript", "Java", "Wordpress", "Boostrap"],
    datasets: [
        {
            label: "My Skill Set",
            backgroundColor: "rgba(255,99,132,0.2)",
            borderColor: "rgba(255,99,132,1)",
            borderWidth: 1,
            hoverBackgroundColor: "rgba(255,99,132,0.4)",
            hoverBorderColor: "rgba(255,99,132,1)",
            data: [100, 90, 80, 82, 85, 88],
        }
    ]
};
var options = {};
var ctx = document.getElementById("myChart").getContext('2d');
var myBarChart = new Chart(ctx, {
    type: 'bar',
    data: data,
    options: options
  });
});

最佳答案

我从你提供的引用中找到了这个..

ar myChart = new Chart(ctx, {
type: 'bar',
data: {
    labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"],
    datasets: [{
        label: '# of Votes',
        data: [12, 19, 3, 5, 2, 3]
    }]
},
options: {
    scales: {
        yAxes: [{
            ticks: {
                beginAtZero:true
            }
        }]
    }
}

尝试一下。

关于javascript - 最后一个值未显示在 charts.js-library 的条形图中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37080011/

相关文章:

javascript - 使用 jquery/d3 动态重用模板

javascript - 有没有JS函数可以求小数点前后的值

jquery - 如何禁用 .removeClass()

html - YouTube iFrame 会自动打开 YouTube 应用程序。我怎样才能阻止这个?

html - 按钮图标向右浮动不起作用

html - 为什么这些图像的底部排成一行?

Javascript - 从另一个输入字段中的日期返回输入字段中的日期

javascript - axios 从同一输入 vue 3 获取字符串和补丁作为对象

javascript - 使用 javascriptpartial.lenses 获取数组中的属性时出现问题

javascript - Jquery getJson 发送 $_GET var 以检索正确的 json 字符串