具有 X 和 Y 值对的数据

2023-12-01

是否可以在中使用 X 和 Y 对dataChart.js 中用于创建条形图的选项?

data: [
    ['08/09/2016', 12],
    ['09/09/2016', 19]
],

形式为[X, Y]

我在文档中没有找到任何关于它的参考。我越接近,发现这个折线图示例:

            data: [{
                x: -10,
                y: 0
            }, {
                x: 0,
                y: 10
            }, {
                x: 10,
                y: 5
            }]

没有内置方法可以直接使用数据数组来创建图表。

但是您可以使用以下方法创建一个小解决方案Chart.js 插件。它们允许您处理在图表的整个创建过程中触发的事件,例如初始化之前、调整大小之后等。


Follows a small plugin that will populate all the data for you using an array :
var myPlugin = {
    // We edit what is happening before the chart is initialized.
    beforeInit: function(chart) {
        var data = chart.config.data;

        // `APIarray` is what you get from your API.
        // For every data in this array ...
        for (var i = 0; i < APIarray.length; i++) {
            // Populate the labels array with the first value ..
            data.labels.push(APIarray[i][0]);
            // .. and the data with the second value
            data.datasets[0].data.push(APIarray[i][1]);
        }
    }
};

然后您需要将这个新创建的插件添加到您的图表插件服务中:

Chart.pluginService.register(myPlugin);


Make sure to register the plugin before creating the chart (before calling new Chart()), or else it won't work.
I also suggest to have an empty data in your chart (before the plugin occurs) to make sure you won't have data you don't want.

您可以看到一个完整的工作示例在这个jsFiddle上.

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

具有 X 和 Y 值对的数据 的相关文章

随机推荐

  • Objective-C 使用动态绑定,但如何实现呢?

    我知道 Objective C 对所有方法调用都使用动态绑定 这是如何实施的 Objective c 是否在编译前 转换为 C 代码 并仅使用 void 指针来处理所有内容 从概念上讲 发生的事情是有一个调度程序库 通常称为 Objecti
  • 创建新的 Backbone 视图时如何知道元素是否已经在 DOM 中

    情况是这样的 当页面第一次打开时 服务器 php 已经准备好了DOM 如果用户打开了 javascript 那么我想将我的页面转换为网络应用程序 或任何你所说的 一旦 Javascript 初始化 Backbone 就会从服务器获取集合 问
  • 具有动态 ID 的 VBA getElementById

    我一直在搜索整个论坛 msdn 和专业教程 但找不到 VBA 的答案 我怎样才能使getElementById在访问 VBA 模块中工作 其中要查找的 id 是动态的 我们看一下html代码 div div class contactsCa
  • 用正确的整数类型替换数组访问变量

    我有使用 int 访问数组的习惯 尤其是在 for 循环中 然而我最近发现我可能一直 做错了 而且我的 x86 系统一直向我隐瞒真相 事实证明 int 没问题sizeof size t sizeof int 但当在系统上使用时sizeof
  • 将字节数组插入 SQL Server

    我正在构建一个sql insert string用于Microsoft ApplicationBlocks Data SqlHelper使用方法如下 SqlHelper ExecuteNonQuery Transaction Command
  • #ref:空手道工具中的 java.util.LinkedHashMap 错误

    def template1 name1 value1 name2 value2 def template2 template1 Def jsontemplate json1 template1 json2 template2 Print j
  • 打印 HttpParams / HttpUriRequest 的内容?

    我有一个HttpUri请求例如 有没有办法打印它包含的所有参数 例如 我几乎可以得到它们 HttpUriRequest req HttpParams params req getParams for int i 0 i lt params
  • Swift:如何找到 UILabel 中字母的位置(x,y)?

    我试图找到 labelText 中字母的位置 Objective C 中的代码是 NSRange range Good Morning rangeOfString NSString prefix Good Morning substring
  • 使用razor引擎在mvc4中重写url

    我想重写以下网址 http localhost 99 Product CategoryLevel CategoryId 65 ProductName Vitamins with http localhost 99 Product Vitam
  • 我的 imageIcon 不起作用?

    我正在尝试设置 JFrame imageIcon 但由于某种原因它没有显示在 JFrame 中 ImageIcon img new ImageIcon stop jpg frame setIconImage img getImage 我创建
  • 比较 dd/mm/yyyy 格式的 2 个日期的最短方法

    谁能建议进行这种比较的最巧妙的方法 我需要测试以 dd mm yyyy 格式提供的日期是否小于固定日期 例如 01 05 2009 我知道我可以使用 strtotime 将它们转换为 unix 时间格式 然后进行比较 但我 我很好奇是否有更
  • 将 bean 自动装配到 JSF 托管 bean 时为空指针

    我使用 Spring Java 邮件和 Velocity 模板开发了一个电子邮件服务 如下所示 电子邮件 java Component public class Email private JavaMailSender mailSender
  • 1.Javascript中的toString()语法错误

    为什么下面的第一行给出错误 而第二行和第三行工作正常 1 toString SyntaxError 1 toString OK 1 toString OK The 存在歧义 它是小数还是属性访问器 解释器将其视为十进制 因此您可以使用 允许
  • 使用 javascript 压缩所有表单数据

    我想压缩一个包含超过 1000 个变量的巨大 HTML 表单中的所有数据 以规避 5 3 9 之前的 PHP 版本中的 max input vars 限制 如何使用 javascript 读取 HTML 表单中的所有数据 将其序列化 或创建
  • 从命令行编译 CUDA 代码

    我正在尝试使用以下语法从命令行编译 CUDA 代码 nvcc c MyFile cu ccbin C Program Files x86 Microsoft Visual Studio 10 0 VC bin 我安装了 CUDA Toolk
  • 如何在cakephp中循环创建pdf文件?

    我已经实现了pdf创建 http bakery cakephp org articles kalileo 2010 06 08 creating pdf files with cakephp and tcpdf 但按照我的逻辑 有一个链接
  • 从tinyMCE中的插入符位置删除x个字符

    我正在开发一个项目 用户可以输入特殊字符 然后按 Tab 键自动完成值 这部分大部分工作正常 但我希望能够从插入符位置之前删除 x 个字符 例如 如果 是插入符号 我有以下文本 chr 我希望能够删除光标位置之前的 3 个字符 例如我最终会
  • 使用 flags() 创建一个 QTableWidgetItem

    我不明白 QTableWidgetItem Chapter 中的 Qt5 文档 我无法获得正确的参数来将新创建的表格单元设置为可编辑 我有这段代码 for i item in enumerate event desc start 0 pri
  • 如何消除结构体数据成员之间的填充字节

    我有一个带有 消息 的二进制文件 我试图使用结构将字节放入正确的变量中 在我的示例中 我使用了两种类型的消息 Tmessage 和 Amessage include
  • 具有 X 和 Y 值对的数据

    是否可以在中使用 X 和 Y 对dataChart js 中用于创建条形图的选项 data 08 09 2016 12 09 09 2016 19 形式为 X Y 我在文档中没有找到任何关于它的参考 我越接近 发现这个折线图示例 data