Google 折线图添加对象数组

2024-05-10

我有一个通过解析 JSON 字符串创建的对象数组:

    var measurementData = @Html.Raw(JsonConvert.SerializeObject(this.Model.Item1));
    var stringifiedData = JSON.stringify(measurementData);
    var parsedData = JSON.parse(stringifiedData);

这给了我许多对象,具体取决于模型,如下所示:

现在我的问题是,如何将它们添加到 Google 折线图中,而不必将其硬编码到数据表中?

这就是我现在所拥有的,它有点作用:

        var data = new google.visualization.DataTable();
        data.addColumn('string', 'TimeStamp');
        data.addColumn('number', selectedMeasurements);

        data.addRows([
            [parsedData[index[0]].TimeStamp, parsedData[index[0]][selectedMeasurements]],
            [parsedData[index[1]].TimeStamp, parsedData[index[1]][selectedMeasurements]]
        ]);

        chart.draw(data, options, {
            isStacked: true,
            vAxis: {
                viewWindowMode: 'explicit',
                viewWindow: {
                    max: 100,
                    min: 0
                }
            }
        });

在这里,我将两个包含数据的数组添加到数据表中,因为要添加两个对象。但如果我只有一个怎么办?还是10个?我想象里面有某种 foreach.addRows但我不知道如何实现这一点。

任何帮助表示赞赏!


您可以使用“setValue(rowIndex,columnIndex,value)”方法:

var jsonData = '[{"SlideId":"D2011", "InstrumentId":"I335", "IncMin":"37.13", "IncMax": "37.19", "BrMin":"31.4"}, {"SlideId":"D2014", "InstrumentId":"I335", "IncMin":"37.13", "IncMax": "37.19", "BrMin":"31.4"}]';

var parsedData = JSON.parse(jsonData);
var len = parsedData.length;

var data = new google.visualization.DataTable();
data.addColumn('string', 'TimeStamp');
data.addColumn('number', selectedMeasurements);

data.addRows(len);

for (var n = 0; n < len; n++) {
    var i=0;
    for (var key in parsedData[n]) {
        data.setValue(n, i, parsedData[n][key]);
        i++;
    }
}

chart.draw(data, options, {
        isStacked: true,
        vAxis: {
            viewWindowMode: 'explicit',
            viewWindow: {
                max: 100,
                min: 0
            }
        }
});

http://jsfiddle.net/mblenton/qnusuLtn/2/ http://jsfiddle.net/mblenton/qnusuLtn/2/

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

Google 折线图添加对象数组 的相关文章

  • JavaScript 支持逐字字符串吗?

    在 C 中 您可以像这样使用逐字字符串 server share file txt JavaScript中有类似的东西吗 模板字符串支持换行 so you can do this if you want https developer mo
  • 在 ajax 请求上启用 jQuery contextMenu 项

    我正在尝试更新上下文菜单 http medialize github com jQuery contextMenu docs htmlitem 如果 ajax 请求改变了我的 div 内容 这就是我的意思 我有一个这样的 div div c
  • 图表.js.如何更改“标签”数组的字体样式?

    我从 Chart JS 库中获取了一个图表 截屏 https i stack imgur com DnuRq png var ctx document getElementById myChart var data labels HTML
  • 网络上的等角柱状图

    我计划为游戏的标记 图钉 构建在线地图 但我无法设置标记的正确纬度 原始地图是一个2048 2048px 的正方形 然后我得到了标记 数千个 地图坐标使用 0 到 100 之间的 x y 表示法设置 0 0 是top left角和100 1
  • 为什么 Promise `.then` 方法的回调是反模式

    我在 StackOverflow 上看到了答案 人们建议为 AngularJS 服务提供回调函数 app controller tokenCtrl function scope tokenService tokenService getTo
  • ASP.NET 验证控件和 Javascript 确认框

    我有一个使用 NET 服务器端输入验证控件的页面 此页面还有一个 javascript 确认框 在提交表单时会触发该确认框 当前 当选择 提交 按钮时 会出现 javascript 确认框 一旦确认 就会触发 ASP NET 服务器端验证控
  • 如何使用 Nextjs/React 将 JSON 对象导出到 Excel?

    我有一个检索 json 对象的端点 如下所示 data id 1 temaIndicador Indian codigo 001 observaciones Interactions Specialist tertiary Regional
  • 替换img路径jquery

    我正在尝试替换 jquery 中的 img 路径 注入远程页面 replaceexample com thumbs withexample com images 我已经尝试过这个 但似乎不起作用 img attr src replace t
  • 修复 Raphaël 路径节点上 Tipsy 工具提示的位置

    这是一个非常具体且有些复杂的问题 所以我设置了一个最小测试用例 http reveal dk 8080 revealit dk tipsytest 在阅读本文的其余部分之前 您可能应该先了解一下 我的页面显示悬停时突出显示区域的图像Raph
  • 公开闭包内的方法

    当我们在闭包内创建一个方法时 该方法将成为该闭包的私有方法 并且在我们以某种方式公开它之前无法访问它 怎么可能暴露呢 您可以返回对它的引用 var a function var b function I m private alert go
  • 使用 eval 时不会受到 XSS 威胁

    我正在制作 不是现在 但我仍然对这个感到好奇 一款使用 HTML5 和 JS 的游戏 我想要的是人们可以插入自定义脚本 但要安全 function executeCustomJS code eval code bad 当然这段代码非常糟糕
  • JS:修改 JS 对象中的值/对

    我正在尝试找出修改对象的最佳方法 而无需三次写出类似的对象 所以我有这三个对象 var object1 start start end end type 1 var object2 start start end end type 2 va
  • 当rest api应用程序服务器(express)和Angulars js应用程序在不同端口上运行时出现Cors问题

    我有用node js编写的rest api应用程序 express在端口3000上运行 而angularjs应用程序在同一服务器上的端口9001上运行 从 angularjs 应用程序调用 rst api 时 出现了 cors 问题 在re
  • 为什么 console.log() polyfill 不使用 Function.apply()?

    我一直在看一些流行的console log 包装 填充 保罗 爱尔兰的 http paulirish com 2009 log a lightweight wrapper for consolelog 本阿尔曼的 http benalman
  • 为什么 TypeScript 混合了模块和原型模式?

    我正在查看此页面上 TypeScript 生成的 JS 代码 http www typescriptlang org Playground http www typescriptlang org Playground 基本上 要创建一个Gr
  • chrome 选项卡/窗口中的 window.open 行为

    我有一小段 javascript 旨在打开两个或更多选项卡 这在 FF 和 IE 中工作正常 但 chrome 会在新窗口而不是选项卡中打开第二个窗口 它不依赖于 url 因为我已经尝试过使用两个相同的 url 第一个在选项卡中打开 第二个
  • 获取类中的所有静态 getter

    假设我有这个类 我像枚举一样使用它 class Color static get Red return 0 static get Black return 1 有没有类似的东西Object keys to get Red Black 我使用
  • 加载 Angular 库时,IE9 和 IE10 中出现 Angular JS“SCRIPT5007:预期对象”错误

    我正在开发一个 AngularJS 应用程序 该应用程序应在 Firefox IE 9 和 IE 10 上运行 我使用最新版本的 angularjs 库 现在是 1 3 15 服务器端是在JavaEE平台上用Java编写的 服务器运行在Gl
  • 测试 jQueryUI 是否已加载

    我正在尝试调试网站 并且我认为 jQueryUI 可能未正确加载 如何测试 jQueryUI 是否已加载 if jQuery ui UI loaded OR if typeof jQuery ui undefined UI loaded 应
  • jQuery appendTo(), json 在 IE 6,7,8 中不起作用

    我这两天绞尽脑汁想找到解决办法 我使用 jQuery ajax 从数据库中获取值 以便在另一个框发生更改时更新一个框 php 脚本从数据库中获取值 然后输出 json 它在 FF 中工作正常 但在所有版本的 IE 中 选择框都不会更新 我已

随机推荐

  • 如何生成随机凸多边形?

    我正在尝试设计一种生成随机二维凸多边形的方法 它必须具有以下属性 坐标应该是整数 多边形应位于角为 0 0 和 C C 的正方形内 其中 C 已给出 多边形的顶点数量应接近给定数量 N 例如 生成具有 10 个顶点并位于正方形 0 100
  • 使用 Ruby CSV 标头转换器

    假设我有以下课程 class Buyer lt ActiveRecord Base attr accesible first name last name 以及 CSV 文件中的以下内容 First Name Last Name John
  • 使用 ClosedXML 附加到 excel 文件

    我需要将新数据附加到使用 ClosedXML 创建的现有 Excel 文件中 如何使用 ClosedXML 附加到 Excel 文件 如何获取最后一条记录的行号并将其附加到该行号上 或者还有其他内容 Thanks 打开现有工作簿 然后使用L
  • 有没有办法模拟小部件或屏幕特定位置的触摸?

    我想触摸或点击小部件上的某处 而不让用户在此时明确触摸屏幕 有什么办法可以做到吗 我已经检查了SO答案 有些人建议使用 集成测试 但在未物理或以某种方式连接到笔记本电脑的设备上无法执行 集成测试 无法找到更好的措辞 我还尝试进行 hitTe
  • Scikit Learn - K-Means - 肘部 - 标准

    今天我想学习一些关于 K means 的知识 我已经了解该算法并且知道它是如何工作的 现在我正在寻找正确的 k 我发现肘部准则作为检测正确的 k 的方法 但我不明白如何将它与 scikit learn 一起使用 在 scikit learn
  • 防止 Windows 中的崩溃消息

    我的应用程序需要扫描经常导致崩溃的第三方文件 为了克服这个问题 它使用一个单独的进程来扫描这些文件并 每当这个进程崩溃时 我的应用程序就会实例化另一个应用程序 我的问题是 每次崩溃后我都会收到 Windows 崩溃消息 AuxScanner
  • Kotlin 中是否有类似于 #region #endregion 的语法?

    我知道我可以使用 region endregion 包围 C 中的代码片段 Kotlin 中是否有类似的语法 谢谢 region MyRegion protected void Page Load object sender EventAr
  • sql查询连接两个服务器中不同数据库的两个表

    我在 ServerS 上的数据库中有两个表 tableA 在 ServerB 上的数据库中有两个表 我只想根据这些表的公共字段名对这些表执行 fullouter join 在 SQL Server 中 您可以创建一个链接服务器 在 Mana
  • 为什么在尝试使用 Java 连接到 RDS PostgreSQL 数据库时会收到 SocketTimeoutException?

    我有一个 Spring 应用程序 我试图在 AWS 上托管 几天来我一直在努力配置 我有一个 EC2 实例 并且能够通过 SSH 连接到它 我还在 AWS 中设置了 Postgres RDS 数据库 但我无法使用 IDE 中的代码连接到它
  • Sentry 与 @sentry/webpack-plugin 和 heroku

    我正在使用 webpack 来构建我的应用程序 它可以在本地使用 sentry webpack plugin 它自动生成版本并将源映射上传到 Sentry 但是 如果我尝试在 Heroku 上构建相同的应用程序 则会出现以下错误 Error
  • 向伪 shell (pty) 发出命令

    我尝试使用 subprocess popen os spawn 来运行进程 但似乎需要伪终端 import pty master slave pty openpty os write master ls l 应该发送 ls l 到从属终端
  • 哪个更快?按引用传递与按值传递 C++

    我认为按引用传递应该比按值传递更快 因为计算机不复制数据 它只是指向数据的地址 但是 请考虑以下 C 代码 include
  • 指向 VLA 的指针

    你可能知道 VLA 的优点和缺点 https stackoverflow com a 3082302 1606345在 C11 中它们是可选的 我认为使 VLA 成为可选的主要原因是 堆栈可能会爆炸 int arr n where n 10
  • 如何表示类的实例与将其作为输入的类之间的关系?

    我有一堂课叫House 这个类的实例是house class House def init self height length self height height self length length def housePlan hou
  • Bazel:将编译标志添加到默认 C++ 工具链

    我想向默认的 C 工具链添加一些编译器和链接器标志 以便我构建的所有目标 本地或导入 共享它们 我知道可以定义我自己的工具链 但我不想这样做 因为它非常复杂且容易出错 理想情况下我想要这样的东西 cc toolchain cc defaul
  • 在 Swift 中使用 Obj-C 完成块

    在 Objective C 中 我有一个完成块类定义为 File h typedef void MYCompletionBlock BOOL success NSDictionary result NSError error 然后 在 Sw
  • dask allocate() 或 apply() 中的变量列名

    我有适用于pandas 但我在将其转换为使用时遇到问题dask 有一个部分解决方案here https stackoverflow com questions 32363114 how do i change rows and column
  • Three.js canvas.toDataURL 有时为空

    我正在尝试使用 html2canvas js 渲染 THREE js 场景 一些覆盖的 HTML 元素 有用大多数时候 但并非一直如此 在失败的情况下 将渲染 HTML 元素 背景 覆盖层等 但不会渲染其他元素 THREE js 场景表现得
  • java中的比较器链

    正在阅读Oracle 关于接口的 Java 教程 https docs oracle com javase tutorial java IandI createinterface html其中给出了一个例子Card 打牌 我试图理解接口中的
  • Google 折线图添加对象数组

    我有一个通过解析 JSON 字符串创建的对象数组 var measurementData Html Raw JsonConvert SerializeObject this Model Item1 var stringifiedData J