第一段代码如下
var data = ${fns:toJson(tblTemperature.tblTemperatureHistoryList)};
返回数组形式的是
var data = [{"id":"0000000000000000000000000000000000000000000000000000000000000014","isNewRecord":false,"remarks":"电源柜标签10","tagId":"E281CA0020000000000002DA","addTime":"2017-04-26 09:46:16","temperature":"30.0","tblTemperature":{"id":"1c3782ea07514577b04c1a87c3d824f0","isNewRecord":false}},{"id":"0000000000000000000000000000000000000000000000000000000000000019","isNewRecord":false,"remarks":"电源柜标签10","tagId":"E281CA0020000000000002DA","addTime":"2017-04-26 12:52:11","temperature":"40.0","tblTemperature":{"id":"1c3782ea07514577b04c1a87c3d824f0","isNewRecord":false}},{"id":"0000000000000000000000000000000000000000000000000000000000000020","isNewRecord":false,"remarks":"电源柜标签10","tagId":"E281CA0020000000000002DA","addTime":"2017-04-26 13:20:28","temperature":"20.0","tblTemperature":{"id":"1c3782ea07514577b04c1a87c3d824f0","isNewRecord":false}},{"id":"0000000000000000000000000000000000000000000000000000000000000027","isNewRecord":false,"remarks":"电源柜标签10","tagId":"E281CA0020000000000002DA","addTime":"2017-04-27 14:17:09","temperature":"50.0","tblTemperature":{"id":"1c3782ea07514577b04c1a87c3d824f0","isNewRecord":false}},{"id":"0000000000000000000000000000000000000000000000000000000000000040","isNewRecord":false,"remarks":"电源柜标签10","tagId":"E281CA0020000000000002DA","addTime":"2017-05-02 15:59:34","temperature":"70.0","tblTemperature":{"id":"1c3782ea07514577b04c1a87c3d824f0","isNewRecord":false}}];
我该如何把addTime和temperature放进Echarts的data中？
var temperature=[];//温度
var addTime=[];//获取时间
$.ajax({
type : "post",
async : true,//异步请求
dataType : "json",
url:"${ctx}/temperaturehistory/tblTemperature/axisTem?id=${tblTemperature.id}",
data:{},
success : function(result) {
temperature.push(result.temperature);
addTime.push(result.addTime);
myChart.setOption({
xAxis : [ {
data : addTime
} ],
series : [ {
data : temperature
} ]
})
}
});
myChart.setOption(option);
整个jsp也面
<script type="text/javascript">
function addRow(list, idx, tpl, row){
$(list).append(Mustache.render(tpl, {
idx: idx, delBtn: true, row: row
}))
}
</script>
</head>
<body>
<div id="main" style="width: 1500px; height: 600px;"></div>
<div class="control-group">
<label class="control-label">子：</label>
<div class="controls">
<table id="contentTable"
class="table table-striped table-bordered table-condensed">
<thead>
<tr>
<th class="hide"></th>
<th>1</th>
<th>2</th>
<th>3</th>
<th>4</th>
<shiro:hasPermission name="temperaturehistory:tblTemperature:edit">
<th width="10"> </th>
</shiro:hasPermission>
</tr>
</thead>
<tbody id="tblTemperatureHistoryList">
</tbody>
</table>
<script type="text/template" id="tblTemperatureHistoryTpl">//<!--
<tr id="tblTemperatureHistoryList{{idx}}">
<td class="hide">
<input id="tblTemperatureHistoryList{{idx}}_id" name="tblTemperatureHistoryList[{{idx}}].id" type="hidden" value="{{row.id}}"/>
<input id="tblTemperatureHistoryList{{idx}}_delFlag" name="tblTemperatureHistoryList[{{idx}}].delFlag" type="hidden" value="0"/>
</td>
<td>
<input id="tblTemperatureHistoryList{{idx}}_tagId" name="tblTemperatureHistoryList[{{idx}}].tagId" type="text" value="{{row.tagId}}" maxlength="64" class="input-small "/>
</td>
<td>
<input id="addTime" name="tblTemperatureHistoryList[{{idx}}].addTime" type="text" readonly="readonly" maxlength="20" class="input-medium Wdate "
value="{{row.addTime}}" onclick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',isShowClear:false});"/>
</td>
<td>
<input id="temperature" name="tblTemperatureHistoryList[{{idx}}].temperature" type="text" value="{{row.temperature}}" class="input-small "/>
</td>
<td>
<textarea id="tblTemperatureHistoryList{{idx}}_remarks" name="tblTemperatureHistoryList[{{idx}}].remarks" rows="4" maxlength="255" class="input-small ">{{row.remarks}}</textarea>
</td>
<shiro:hasPermission name="temperaturehistory:tblTemperature:edit"><td class="text-center" width="10">
{{#delBtn}}<span class="close" onclick="delRow(this, '#tblTemperatureHistoryList{{idx}}')" title="删除">×</span>{{/delBtn}}
</td></shiro:hasPermission>
</tr>//-->
</script>
<script type="text/javascript"
src="/jeesite/static/js/echarts/echarts.js"></script>
<script type="text/javascript"
src="/jeesite/static/jquery/jquery-1.8.3.js"></script>
<script type="text/javascript">
var myChart = echarts.init(document.getElementById('main'))
option= {
color: ['#ff3d3d', '#00a0e9', '#f603ff','#00b419','#5f52a0'],
tooltip: {
trigger: 'axis'
},
legend: {
x: 'left',
padding: [10, 20,0,20],
data:['温度'],
},
grid: {
left: '0',
right: '3%',
bottom: '3%',
top:'13%',
containLabel: true
},
xAxis: {
type: 'category',
boundaryGap: false,
splitLine:{//网格线
show: true,
lineStyle:{
color:['#b1b1b1'],
type:'dashed'
}
},
data: []
},
yAxis: {
splitLine:{//网格线
show: true,
lineStyle:{
color:['#b1b1b1'],
type:'dashed'
}
}
},
series: [
{
name:'温度',
type:'line',
data:[],
label: {
normal: {
show: true,
position: 'top'//值显示
}
}
}
]
};
var datai = ${fns:toJson(tblTemperature.tblTemperatureHistoryList)};
var temperature=[];//温度
var addTime=[];//获取时间
$.ajax({
type : "post",
async : true,//异步请求
dataType : "json",
data:{},
success : function(result) {
for(var i =0;i<datai.length;i++){
for(var j=0;j<data[i].length;j++){
temperature.push(datai[i][j].temperatuer);
addTime.push(datai[i][j].addTime);
}
}
myChart.setOption({
xAxis :{
data:addTime
},
series : {
data:temperature
}
})
}
});
myChart.setOption(option);
//打印数据，用于测试数据是否得到
console.warn(temperature, addTime);
</script>
<script type="text/javascript">
var tblTemperatureHistoryRowIdx = 0,
tblTemperatureHistoryTpl = $("#tblTemperatureHistoryTpl").html().replace(/(\/\/\<!\-\-)|(\/\/\-\->)/g,"");
$(document).ready(function() {
alert(1)
var data = ${fns:toJson(tblTemperature.tblTemperatureHistoryList)};
for (var i=0; i<data.length; i++){
addRow('#tblTemperatureHistoryList', tblTemperatureHistoryRowIdx, tblTemperatureHistoryTpl, data[i]);
tblTemperatureHistoryRowIdx = tblTemperatureHistoryRowIdx + 1;
}
});
</script>
</div>
</div>
</body>
