使用G2线图出现的问题
Opened this issue · 0 comments
htmlop commented
<title>各城市温度对比</title>
<script src="https://a.alipayobjects.com/jquery/jquery/1.11.1/jquery.js"></script>
<script src="https://gw.alipayobjects.com/as/g/datavis/g2/2.3.12/index.js"></script>
<script>
var data=[{"ID":7072.0,"DEVNUMBER":"00160001","SOLARVOLTAGE":10.0,"MAINSVOLTAGE":50.0,"CELLVOLTAGE":16.0,"TEMPERATURE":23.0,"AMPLITUDEX":1.0,"AMPLITUDEY":1.0,"AMPLITUDEZ":1.0,"BATTERI":10.0,"UPLOADTIME":"2017-09-20 19:01:21","SHIPNAME":"采砂001","ROW_ID":"AAAaV9AANAAAAM9AAD"},{"ID":3660.0,"DEVNUMBER":"00160001","SOLARVOLTAGE":20.0,"MAINSVOLTAGE":30.0,"CELLVOLTAGE":40.0,"TEMPERATURE":23.0,"AMPLITUDEX":1.0,"AMPLITUDEY":1.0,"AMPLITUDEZ":1.0,"BATTERI":10.0,"UPLOADTIME":"2017-09-20 18:19:26","SHIPNAME":"采砂001","ROW_ID":"AAAaV9AANAAAAM9AAC"},{"ID":7574.0,"DEVNUMBER":"00160001","SOLARVOLTAGE":20.0,"MAINSVOLTAGE":20.0,"CELLVOLTAGE":20.0,"TEMPERATURE":20.0,"AMPLITUDEX":1.0,"AMPLITUDEY":1.0,"AMPLITUDEZ":1.0,"BATTERI":20.0,"UPLOADTIME":"2017-09-20 16:26:13","SHIPNAME":"采砂001","ROW_ID":"AAAaV9AANAAAAM9AAB"},{"ID":1171.0,"DEVNUMBER":"00160001","SOLARVOLTAGE":10.0,"MAINSVOLTAGE":10.0,"CELLVOLTAGE":10.0,"TEMPERATURE":30.0,"AMPLITUDEX":1.0,"AMPLITUDEY":1.0,"AMPLITUDEZ":1.0,"BATTERI":20.0,"UPLOADTIME":"2017-09-20 15:40:15","SHIPNAME":"采砂001","ROW_ID":"AAAaV9AANAAAAM9AAA"}];
aa(data)
function aa(data){
var Frame = G2.Frame;
var frame = new Frame(data);
frame = Frame.combinColumns(frame, ['SOLARVOLTAGE', 'MAINSVOLTAGE','CELLVOLTAGE'], 'value', 'city', 'UPLOADTIME');
var chart = new G2.Chart({
id: 'c1',
forceFit: true,
height: 450,
plotCfg: {
margin: [20, 20, 100, 80]
}
});
chart.source(frame, {
UPLOADTIME: {
type: 'time',
mask: 'yy.mm.dd HH:MM:ss',
tickCount: 12
},
value: {
alias: '电压 V'
}
});
chart.legend({
position: 'bottom'
});
chart.axis('UPLOADTIME', {
line: null,
tickLine: {
stroke: '#000',
value: 6 // 刻度线长度
},
title: null
});
chart.axis('value', {
tickLine: {
stroke: '#000',
value: 6 // 刻度线长度
},
labels: {
label: {
fill: '#000'
}
},
line: {
stroke: '#000'
},
grid: null
});
chart.line().position('UPLOADTIME*value').color('city', ['#1f77b4', '#ff7f0e', '#2ca02c']).shape('spline').size(2);
chart.render();
}
</script>
会多出一个点