思路:1、获取后台传过来的json数据(使用ajax等),此处我用的是前一个页面中传过来的json数据
2、解析我们想要json数据(这是将要传入到highcharts中series下的data)
3、将数据绑定到显示图表的方法中[如何绑定是此问题的难点]
下面的例子:具体解释
首先加载bind(),bind()中 getTemperature(td,tm,ty);getHumidity(hd,hm,hy);,它们是对应的图表中数据的绑定
(由于bind()方法中解析的json数据,外面不易访问,故在bind中直接传值绑定即可)
<script type="text/javascript">
// JSONData = {
// "id": "-1",
// "site_name": "网络中心一楼",
// "address": "大学城图书馆网络中心一楼",
// "t": "36.0",
// "h": "0.600",
// "l": "正常",
// "s": "异常",
// "td":
"17.5,18.3,20.2,21.9,24.3,26.0,28.5,29.2,30.2,31.5,32.8,33.6,35.2,36.9,38.8,36.8,35.3,33.1,30.6,28.8,26.
9,24.6,22.7,19.8",
// "tm":
"15.3,16.4,17.9,20.0,22.2,24.1,25.7,27.3,29.4,30.7,31.9,32.8,34.0,36.8,37.9,36.3,35.2,32.6,30.2,27.7,25.
8,23.8,22.4,19.4",
// "ty":
"14.8,15.8,17.3,19.7,21.8,23.8,25.5,27.1,29.4,30.6,31.8,32.7,33.8,36.6,37.9,36.3,35.2,32.5,30.1,27.6,25.
7,23.6,22.3,19.2",
// "hd":
"0.530,0.532,0.549,0.569,0.572,0.609,0.622,0.633,0.642,0.643,0.651,0.652,0.660,0.651,0.645,0.642,0.640,0
.629,0.602,0.580,0.565,0.543,0.530,0.525",
// "hm":
"0.523,0.530,0.546,0.568,0.579,0.607,0.622,0.631,0.632,0.633,0.638,0.639,0.652,0.646,0.643,0.638,0.634,0
.625,0.614,0.583,0.570,0.551,0.532,0.524",
// "hy":
"0.522,0.529,0.548,0.568,0.578,0.616,0.622,0.632,0.632,0.632,0.636,0.638,0.652,0.646,0.642,0.637,0.633,0
.626,0.615,0.584,0.571,0.554,0.534,0.524"
// };
//存储从服务器接收的JSON数据
var DataJSON;
//温度日均线
var td;
2、解析我们想要json数据(这是将要传入到highcharts中series下的data)
3、将数据绑定到显示图表的方法中[如何绑定是此问题的难点]
下面的例子:具体解释
首先加载bind(),bind()中 getTemperature(td,tm,ty);getHumidity(hd,hm,hy);,它们是对应的图表中数据的绑定
(由于bind()方法中解析的json数据,外面不易访问,故在bind中直接传值绑定即可)
<script type="text/javascript">
// JSONData = {
// "id": "-1",
// "site_name": "网络中心一楼",
// "address": "大学城图书馆网络中心一楼",
// "t": "36.0",
// "h": "0.600",
// "l": "正常",
// "s": "异常",
// "td":
"17.5,18.3,20.2,21.9,24.3,26.0,28.5,29.2,30.2,31.5,32.8,33.6,35.2,36.9,38.8,36.8,35.3,33.1,30.6,28.8,26.
9,24.6,22.7,19.8",
// "tm":
"15.3,16.4,17.9,20.0,22.2,24.1,25.7,27.3,29.4,30.7,31.9,32.8,34.0,36.8,37.9,36.3,35.2,32.6,30.2,27.7,25.
8,23.8,22.4,19.4",
// "ty":
"14.8,15.8,17.3,19.7,21.8,23.8,25.5,27.1,29.4,30.6,31.8,32.7,33.8,36.6,37.9,36.3,35.2,32.5,30.1,27.6,25.
7,23.6,22.3,19.2",
// "hd":
"0.530,0.532,0.549,0.569,0.572,0.609,0.622,0.633,0.642,0.643,0.651,0.652,0.660,0.651,0.645,0.642,0.640,0
.629,0.602,0.580,0.565,0.543,0.530,0.525",
// "hm":
"0.523,0.530,0.546,0.568,0.579,0.607,0.622,0.631,0.632,0.633,0.638,0.639,0.652,0.646,0.643,0.638,0.634,0
.625,0.614,0.583,0.570,0.551,0.532,0.524",
// "hy":
"0.522,0.529,0.548,0.568,0.578,0.616,0.622,0.632,0.632,0.632,0.636,0.638,0.652,0.646,0.642,0.637,0.633,0
.626,0.615,0.584,0.571,0.554,0.534,0.524"
// };
//存储从服务器接收的JSON数据
var DataJSON;
//温度日均线
var td;