96 lines
2.4 KiB
JavaScript
96 lines
2.4 KiB
JavaScript
$(function()
|
|
{
|
|
$('[data-toggle=tooltip]').tooltip();
|
|
|
|
if(chartData)
|
|
{
|
|
var i = 0;
|
|
var series = [];
|
|
var colors = ['#33B4DB', '#7ECF69', '#FFC73A', '#FF5A61', '#50C8D0', '#AF5AFF', '#4EA3FF', '#FF8C5A', '#6C73FF'];
|
|
//var background = ['#E1F4FA', '#ECF8E9', '#FFF7E2', '#FFE7E8', '#E5F7F8', '#F3E7FF', '#E5F1FF', '#FFEEE7', '#E9EAFF'];
|
|
|
|
$.each(chartData['line'], function(label, set)
|
|
{
|
|
series.push({
|
|
name: label,
|
|
type: 'line',
|
|
stack: 'Total',
|
|
color: colors[i],
|
|
areaStyle: {
|
|
color: colors[i],
|
|
opacity: 0.2
|
|
},
|
|
emphasis: {
|
|
focus: 'series'
|
|
},
|
|
data: eval(set)
|
|
})
|
|
i ++;
|
|
})
|
|
|
|
var chartDom = document.getElementById('cfdChart');
|
|
var CFD = echarts.init(chartDom);
|
|
var option;
|
|
|
|
option = {
|
|
tooltip: {
|
|
trigger: 'axis',
|
|
axisPointer: {
|
|
type: 'cross',
|
|
label: {
|
|
backgroundColor: '#6a7985'
|
|
}
|
|
}
|
|
},
|
|
legend: {
|
|
data: Object.keys(chartData['line'])
|
|
},
|
|
grid: {
|
|
left: '3%',
|
|
right: '4%',
|
|
bottom: '3%',
|
|
containLabel: true
|
|
},
|
|
xAxis: [
|
|
{
|
|
type: 'category',
|
|
boundaryGap: false,
|
|
data: chartData['labels'],
|
|
axisLine:
|
|
{
|
|
show: true,
|
|
lineStyle:
|
|
{
|
|
color: '#999',
|
|
width:1
|
|
}
|
|
}
|
|
}],
|
|
yAxis: [
|
|
{
|
|
type: 'value',
|
|
minInterval: 1,
|
|
axisLine:
|
|
{
|
|
show: true,
|
|
lineStyle:
|
|
{
|
|
color: ['#999'],
|
|
width: 1
|
|
}
|
|
}
|
|
}
|
|
],
|
|
series: series,
|
|
};
|
|
|
|
option && CFD.setOption(option);
|
|
window.addEventListener('resize', CFD.resize);
|
|
}
|
|
|
|
$('#type').change(function()
|
|
{
|
|
location.href = createLink('execution', 'cfd', 'executionID=' + executionID + '&type=' + $(this).val());
|
|
});
|
|
});
|