自定义的plot函数参数date坐标模型[x，y]的使用建议

最新推荐文章于 2023-06-13 12:50:23 发布

Symbol__

最新推荐文章于 2023-06-13 12:50:23 发布

阅读量1k

点赞数

分类专栏： Web前端

本文链接：https://blog.csdn.net/symbol1993/article/details/70599025

版权

本文介绍了如何使用$.plot函数绘制图表，特别是处理从后台获取的JSON数据来构造xy坐标模型。讨论了JSON数据的两种结构：对象和数组，并提供了Java代码示例来初始化坐标数据。通过设置y坐标为零，确保没有数据时图表显示不会出错，避免断点问题。

摘要由CSDN通过智能技术生成

调用plot函数的方法如下：

var plot = $.plot(placeholder, data, options)

分析：data应该是data series的一个数组：[ [x1, y1], [x2, y2], ... ]

data是从后台传数据过来，通常是用ajax去获取的json数据，那么我们就可以在java后台去考虑xy坐标模型的构造了。

这里我先提一下JSON中的两种数据结构：对象和数组。

对象以"{"（左括号）开始，"}"（右括号）结束。每个"名称"后跟一个":"（冒号）；"'名称/值’'对"之间运用 “,”（逗号）分隔。名称用引号括起来；值如果是字符串则必须用括号，数值型则不须要。例如：

{
"errMsg": null,
"resultObj": {
"Load": "[[0,0]],",
"loadRate": "[[0,0], [27,218.84424]]",
"reportTitle": "2017年03月",
"mma": {
"createtime": "2017-04-10 08:55:31",
"ctid": 2,
"id": 3,
"loadAvg": 3.84237,
"loadMax": 132.35739,
"loadMaxTime": "2017-03-07 15:45:00",
"loadMin": 0,
"loadMinTime": "2017-03-06 12:30:00",
"loadRate": 79.80018,
"yearmonth": "2017-03"
}
}
}

数组是值（value）的有序集合。一个数组以”[”（左中括号）开始，"]"（右中括号）结束。值之间运用 ","（逗号）分隔。

例如：

[{
"createtime": "2017-04-10 08:55:31",
"ctid": 2,
"id": 3,
"loadAvg": 3.84237,
"loadMax": 132.35739,
"loadMaxTime": "2017-03-07 15:45:00",
"loadMin": 0,
"loadMinTime": "2017-03-06 12:30:00",
"loadRate": 79.80018,
"yearmonth": "2017-03"
},{