Compare commits
11 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 302b40bcef | |||
| e89150507c | |||
| 0bd84d865f | |||
| 5fe321828a | |||
| 2e573e2c72 | |||
| 84d136d4cf | |||
| 9b296c45bd | |||
| ef9db8bee2 | |||
| 7c4515521d | |||
| 7b6948d027 | |||
| 28f1aef82c |
@@ -208,7 +208,6 @@ export default {
|
||||
const topicSplit = topic.split('/')
|
||||
const deviceID = parseInt(topicSplit[3])
|
||||
const channel = parseInt(topicSplit[4])
|
||||
|
||||
dataStreamBuffer.into(String.fromCharCode.apply(null, data), deviceID, (channel + 1))
|
||||
},
|
||||
'+/device_save_path/+' (data, topic) {
|
||||
|
||||
@@ -26,6 +26,10 @@
|
||||
</va-tabs>
|
||||
<div v-if="tabValue == 0" >
|
||||
<div v-if="chartData[chartID].legend.data.length != 0">
|
||||
<canvas-chart-real-time-display
|
||||
:chartID="chartID"
|
||||
/>
|
||||
<!-- chart -->
|
||||
<chart :key="taskContentChartKey" :ref="'chart_ref'" :style="'width: '+ cardwidth + '; height: ' + cardheight + ';'" :options="data" :auto-resize="true"></chart>
|
||||
</div>
|
||||
</div>
|
||||
@@ -108,6 +112,7 @@ import CanvasChartFilterPopup from './CanvasChartFilterPopup.vue'
|
||||
import CanvasChartSource from './CanvasChartSource'
|
||||
import { taskInfo } from '../../../../data/task/TaskInfo'
|
||||
import { mapFields } from 'vuex-map-fields'
|
||||
import CanvasChartRealTimeDisplay from '@/components/task/content/chart/CanvasChartRealTimeDisplay'
|
||||
import { mapActions } from 'vuex'
|
||||
import taskTypes from '@/store/modules/task/content/types'
|
||||
|
||||
@@ -118,6 +123,7 @@ export default {
|
||||
CanvasChartSource,
|
||||
CanvasChartFilter,
|
||||
CanvasChartFilterPopup,
|
||||
CanvasChartRealTimeDisplay,
|
||||
},
|
||||
props: {
|
||||
chartID: {
|
||||
@@ -146,6 +152,7 @@ export default {
|
||||
...mapFields('taskContent', [
|
||||
'chartData',
|
||||
'taskContentChartKey',
|
||||
'deviceListNew',
|
||||
]),
|
||||
},
|
||||
data () {
|
||||
@@ -322,7 +329,6 @@ export default {
|
||||
type: 'legendInverseSelect',
|
||||
})
|
||||
},
|
||||
|
||||
...mapActions('taskContent', [
|
||||
taskTypes.chart.saveToCache,
|
||||
]),
|
||||
|
||||
@@ -0,0 +1,218 @@
|
||||
<template>
|
||||
<div>
|
||||
<div v-for="(chart, chartIndex) in realTime" :key="'c'+chartIndex">
|
||||
<div v-for="(grid, gridIndex) in chart" :key="'s'+gridIndex" class="row ma-0 pa-0">
|
||||
<div class="col flex xs0 sm0 lg0 md0 xl0 xxl1"/>
|
||||
<div class="col flex xs2 sm2 lg2 md2 xl2 xxl1" pa-0 ma-0>
|
||||
<p color="primary" style="text-align: right;">{{ grid.name }}</p>
|
||||
</div>
|
||||
<!-- value (y-axis) -->
|
||||
<div class="col flex sm2 xl2 md2 xs2">
|
||||
<va-input
|
||||
label="y-value"
|
||||
disable="disable"
|
||||
v-model="grid.yValue"
|
||||
/>
|
||||
</div>
|
||||
<!-- unit (y-axis) -->
|
||||
<div class="col flex sm2 xl2 md2 xs2">
|
||||
<va-select
|
||||
label="y-unit"
|
||||
v-model="grid.yUnit"
|
||||
:options="grid.yUnitOption"
|
||||
noClear
|
||||
/>
|
||||
</div>
|
||||
<div class="col flex sm1 xl1 md1 xs1"></div>
|
||||
<!-- value (x-axis) -->
|
||||
<div class="col flex sm2 xl2 md2 xs2">
|
||||
<va-input
|
||||
label="x-value"
|
||||
disable="disable"
|
||||
v-model="grid.xValue"
|
||||
/>
|
||||
</div>
|
||||
<!-- unit (x-axis) -->
|
||||
<div class="col flex sm2 xl2 md2 xs2">
|
||||
<va-select
|
||||
label="x-unit"
|
||||
v-model="grid.xUnit"
|
||||
:options="grid.xUnitOption"
|
||||
noClear
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapFields } from 'vuex-map-fields'
|
||||
import paramTable from '@/data/param-table/index.js'
|
||||
import newTooltip from '@/factories/chart/tooltipFactory'
|
||||
|
||||
export default {
|
||||
name: 'CanvasChartRealTimeDisplay',
|
||||
props: {
|
||||
chartID: {
|
||||
type: [Number, String],
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
...mapFields('taskContent', [
|
||||
'chartData',
|
||||
'deviceListNew',
|
||||
]),
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
data: null,
|
||||
paramTable: paramTable,
|
||||
realTime: [[]],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// record the latest data as the real time value
|
||||
updateValue: function () {
|
||||
if ((this.realTime.length === 0)) {
|
||||
return
|
||||
}
|
||||
for (let gridIndex = 0; gridIndex < this.realTime.length; gridIndex++) {
|
||||
for (let channelIndex = 0; channelIndex < this.realTime[gridIndex].length; channelIndex++) {
|
||||
// miss the source of data -> try to find the source
|
||||
if (this.realTime[gridIndex][channelIndex].seriesSource === -1) {
|
||||
this.realTime[gridIndex][channelIndex].seriesSource = this.data.series.findIndex((ele) => ele.name === this.realTime[gridIndex][channelIndex].name)
|
||||
}
|
||||
|
||||
// the device is active now --> update the real time value
|
||||
if (this.data.series[this.realTime[gridIndex][channelIndex].seriesSource] !== undefined && this.data.series[this.realTime[gridIndex][channelIndex].seriesSource].data !== undefined && this.data.series[this.realTime[gridIndex][channelIndex].seriesSource].data.length > 0) {
|
||||
this.realTime[gridIndex][channelIndex].xValue = (this.data.series[this.realTime[gridIndex][channelIndex].seriesSource].data.at(-1)[0] / this.realTime[gridIndex][channelIndex].xValueScale[this.realTime[gridIndex][channelIndex].xUnit]).toFixed(3)
|
||||
this.realTime[gridIndex][channelIndex].yValue = (this.data.series[this.realTime[gridIndex][channelIndex].seriesSource].data.at(-1)[1] / this.realTime[gridIndex][channelIndex].yValueScale[this.realTime[gridIndex][channelIndex].yUnit]).toFixed(3)
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
// change the axis unit of charts
|
||||
updateUnit: function () {
|
||||
for (let gridIndex = 0; gridIndex < this.realTime.length; gridIndex++) {
|
||||
for (let channelIndex = 0; channelIndex < this.realTime[gridIndex].length; channelIndex++) {
|
||||
if (channelIndex === 0) {
|
||||
const _xUnit = this.realTime[gridIndex][channelIndex].xUnit
|
||||
const _yUnit = this.realTime[gridIndex][channelIndex].yUnit
|
||||
const _xScale = this.realTime[gridIndex][channelIndex].xValueScale[this.realTime[gridIndex][channelIndex].xUnit]
|
||||
const _yScale = this.realTime[gridIndex][channelIndex].yValueScale[this.realTime[gridIndex][channelIndex].yUnit]
|
||||
|
||||
this.data.xAxis[gridIndex].axisLabel.formatter = function (val) {
|
||||
return parseFloat(val / _xScale).toFixed(2) + _xUnit
|
||||
}
|
||||
|
||||
this.data.yAxis[gridIndex].axisLabel.formatter = function (val) {
|
||||
return parseFloat(val / _yScale).toFixed(2) + _yUnit
|
||||
}
|
||||
// update tooltip
|
||||
this.data.tooltip.formatter = newTooltip(this.realTime).formatter
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
// for user to choose wanted unit
|
||||
setUnit: function (gridIndex, channelIndex) {
|
||||
// find coressponding device for current chart
|
||||
const device = this.deviceListNew.find(chart => {
|
||||
return chart.memory_board === parseInt(this.chartData[this.chartID].mappingID)
|
||||
})
|
||||
if (!device) {
|
||||
return
|
||||
}
|
||||
|
||||
// construct realTime object, i.e., record the coressponding value and unit
|
||||
// the formate imitates the data.gridSource
|
||||
const modeTable = this.paramTable[device.library_name].MODE[device.configuration.MODE]
|
||||
const _realTime = JSON.parse(JSON.stringify(this.realTime))
|
||||
const _newChannel = {}
|
||||
let xAxis = null
|
||||
let yAxis = null
|
||||
|
||||
// find the the data of each axis coming from which channel
|
||||
if (this.data.series.length > 0) {
|
||||
_newChannel.name = this.data.gridSource[gridIndex][channelIndex].name
|
||||
_newChannel.seriesSource = this.data.series.findIndex((ele) => ele.name === _newChannel.name)
|
||||
xAxis = this.data.series[_newChannel.seriesSource].xAxisSource[1] - 1
|
||||
yAxis = this.data.series[_newChannel.seriesSource].yAxisSource[1] - 1
|
||||
xAxis = (xAxis === -2) ? 'time' : xAxis
|
||||
yAxis = (yAxis === -2) ? 'time' : yAxis
|
||||
}
|
||||
|
||||
// check if xAxis unit has been defined in modeTable
|
||||
if (Object.prototype.hasOwnProperty.call(modeTable.channels, xAxis)) {
|
||||
_newChannel.xUnit = modeTable.channels[xAxis].defaultUnit
|
||||
_newChannel.xValueScale = modeTable.channels[xAxis].unit
|
||||
_newChannel.xUnitOption = Object.keys(modeTable.channels[xAxis].unit)
|
||||
} else {
|
||||
_newChannel.xUnit = 'unvalid'
|
||||
_newChannel.xValueScale = { unvalid: NaN }
|
||||
_newChannel.xUnitOption = ['']
|
||||
}
|
||||
// check if yAxis unit has been defined in modeTable
|
||||
if (Object.prototype.hasOwnProperty.call(modeTable.channels, yAxis)) {
|
||||
_newChannel.yUnit = modeTable.channels[yAxis].defaultUnit
|
||||
_newChannel.yValueScale = modeTable.channels[yAxis].unit
|
||||
_newChannel.yUnitOption = Object.keys(modeTable.channels[yAxis].unit)
|
||||
} else {
|
||||
_newChannel.yUnit = 'unvalid'
|
||||
_newChannel.yValueScale = { unvalid: NaN }
|
||||
_newChannel.yUnitOption = ['']
|
||||
}
|
||||
|
||||
// set real time value = 0 as default
|
||||
_newChannel.xValue = 0
|
||||
_newChannel.yValue = 0
|
||||
|
||||
// padding
|
||||
while (gridIndex >= _realTime.length) {
|
||||
_realTime.push([])
|
||||
}
|
||||
while (channelIndex >= _realTime[gridIndex].length) {
|
||||
_realTime[gridIndex].push({})
|
||||
}
|
||||
|
||||
// merge the additional part into original part
|
||||
_realTime[gridIndex][channelIndex] = _newChannel
|
||||
this.realTime = _realTime
|
||||
},
|
||||
// for each lines on the charts should have its own real time display
|
||||
matchChart: function () {
|
||||
for (let gridIndex = 0; gridIndex < this.data.gridSource.length; gridIndex++) {
|
||||
if (this.data.gridSource[gridIndex] !== undefined) {
|
||||
for (let channelIndex = 0; channelIndex < this.data.gridSource[gridIndex].length; channelIndex++) {
|
||||
if (gridIndex >= this.realTime.length) {
|
||||
this.setUnit(gridIndex, channelIndex)
|
||||
} else if (channelIndex >= this.realTime[gridIndex].length) {
|
||||
this.setUnit(gridIndex, channelIndex)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
mounted () {
|
||||
this.data = this.chartData[this.chartID]
|
||||
},
|
||||
watch: {
|
||||
data: {
|
||||
handler: function () {
|
||||
this.updateValue()
|
||||
this.matchChart()
|
||||
},
|
||||
deep: true,
|
||||
},
|
||||
realTime: {
|
||||
handler: function () {
|
||||
this.updateUnit()
|
||||
},
|
||||
deep: true,
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
@@ -22,11 +22,10 @@ export default {
|
||||
us: 1,
|
||||
ms: 1e3,
|
||||
s: 1e6,
|
||||
m: 60 * 1e6,
|
||||
h: 60 * 60 * 1e6,
|
||||
auto: 1,
|
||||
minute: 60 * 1e6,
|
||||
hour: 60 * 60 * 1e6,
|
||||
},
|
||||
defaultUnit: 'auto',
|
||||
defaultUnit: 'ms',
|
||||
downloadUnit: 'ms',
|
||||
},
|
||||
0: {
|
||||
@@ -36,7 +35,7 @@ export default {
|
||||
uA: 1e3,
|
||||
mA: 1e6,
|
||||
},
|
||||
defaultUnit: 'uA',
|
||||
defaultUnit: 'mA',
|
||||
downloadUnit: 'mA',
|
||||
},
|
||||
1: {
|
||||
|
||||
@@ -22,11 +22,10 @@ export default {
|
||||
us: 1,
|
||||
ms: 1e3,
|
||||
s: 1e6,
|
||||
m: 60 * 1e6,
|
||||
h: 60 * 60 * 1e6,
|
||||
auto: 1,
|
||||
minute: 60 * 1e6,
|
||||
hour: 60 * 60 * 1e6,
|
||||
},
|
||||
defaultUnit: 'auto',
|
||||
defaultUnit: 'ms',
|
||||
downloadUnit: 'ms',
|
||||
},
|
||||
0: {
|
||||
@@ -36,7 +35,7 @@ export default {
|
||||
uA: 1e3,
|
||||
mA: 1e6,
|
||||
},
|
||||
defaultUnit: 'uA',
|
||||
defaultUnit: 'mA',
|
||||
downloadUnit: 'mA',
|
||||
},
|
||||
1: {
|
||||
|
||||
@@ -22,11 +22,10 @@ export default {
|
||||
us: 1,
|
||||
ms: 1e3,
|
||||
s: 1e6,
|
||||
m: 60 * 1e6,
|
||||
h: 60 * 60 * 1e6,
|
||||
auto: 1,
|
||||
minute: 60 * 1e6,
|
||||
hour: 60 * 60 * 1e6,
|
||||
},
|
||||
defaultUnit: 'auto',
|
||||
defaultUnit: 'ms',
|
||||
downloadUnit: 'ms',
|
||||
},
|
||||
0: {
|
||||
@@ -36,7 +35,7 @@ export default {
|
||||
uA: 1e3,
|
||||
mA: 1e6,
|
||||
},
|
||||
defaultUnit: 'uA',
|
||||
defaultUnit: 'mA',
|
||||
downloadUnit: 'mA',
|
||||
},
|
||||
1: {
|
||||
|
||||
@@ -22,11 +22,10 @@ export default {
|
||||
us: 1,
|
||||
ms: 1e3,
|
||||
s: 1e6,
|
||||
m: 60 * 1e6,
|
||||
h: 60 * 60 * 1e6,
|
||||
auto: 1,
|
||||
minute: 60 * 1e6,
|
||||
hour: 60 * 60 * 1e6,
|
||||
},
|
||||
defaultUnit: 'auto',
|
||||
defaultUnit: 'ms',
|
||||
downloadUnit: 'ms',
|
||||
},
|
||||
0: {
|
||||
@@ -36,7 +35,7 @@ export default {
|
||||
uA: 1e3,
|
||||
mA: 1e6,
|
||||
},
|
||||
defaultUnit: 'uA',
|
||||
defaultUnit: 'mA',
|
||||
downloadUnit: 'mA',
|
||||
},
|
||||
1: {
|
||||
|
||||
@@ -24,9 +24,8 @@ export default {
|
||||
s: 1e6,
|
||||
m: 60 * 1e6,
|
||||
h: 60 * 60 * 1e6,
|
||||
auto: 1,
|
||||
},
|
||||
defaultUnit: 'auto',
|
||||
defaultUnit: 'ms',
|
||||
downloadUnit: 'ms',
|
||||
},
|
||||
0: {
|
||||
@@ -36,7 +35,7 @@ export default {
|
||||
uA: 1e3,
|
||||
mA: 1e6,
|
||||
},
|
||||
defaultUnit: 'uA',
|
||||
defaultUnit: 'mA',
|
||||
downloadUnit: 'mA',
|
||||
},
|
||||
1: {
|
||||
|
||||
@@ -27,11 +27,10 @@ export default {
|
||||
us: 1,
|
||||
ms: 1e3,
|
||||
s: 1e6,
|
||||
m: 60 * 1e6,
|
||||
h: 60 * 60 * 1e6,
|
||||
auto: 1,
|
||||
minute: 60 * 1e6,
|
||||
hour: 60 * 60 * 1e6,
|
||||
},
|
||||
defaultUnit: 'auto',
|
||||
defaultUnit: 'ms',
|
||||
downloadUnit: 'ms',
|
||||
},
|
||||
0: {
|
||||
@@ -41,7 +40,7 @@ export default {
|
||||
uA: 1e3,
|
||||
mA: 1e6,
|
||||
},
|
||||
defaultUnit: 'uA',
|
||||
defaultUnit: 'mA',
|
||||
downloadUnit: 'mA',
|
||||
},
|
||||
1: {
|
||||
|
||||
@@ -22,11 +22,10 @@ export default {
|
||||
us: 1,
|
||||
ms: 1e3,
|
||||
s: 1e6,
|
||||
m: 60 * 1e6,
|
||||
h: 60 * 60 * 1e6,
|
||||
auto: 1,
|
||||
minute: 60 * 1e6,
|
||||
hour: 60 * 60 * 1e6,
|
||||
},
|
||||
defaultUnit: 'auto',
|
||||
defaultUnit: 'ms',
|
||||
downloadUnit: 'ms',
|
||||
},
|
||||
0: {
|
||||
@@ -36,7 +35,7 @@ export default {
|
||||
uA: 1e3,
|
||||
mA: 1e6,
|
||||
},
|
||||
defaultUnit: 'uA',
|
||||
defaultUnit: 'mA',
|
||||
downloadUnit: 'mA',
|
||||
},
|
||||
1: {
|
||||
|
||||
@@ -22,11 +22,10 @@ export default {
|
||||
us: 1,
|
||||
ms: 1e3,
|
||||
s: 1e6,
|
||||
m: 60 * 1e6,
|
||||
h: 60 * 60 * 1e6,
|
||||
auto: 1,
|
||||
minute: 60 * 1e6,
|
||||
hour: 60 * 60 * 1e6,
|
||||
},
|
||||
defaultUnit: 'auto',
|
||||
defaultUnit: 'ms',
|
||||
downloadUnit: 'ms',
|
||||
},
|
||||
0: {
|
||||
@@ -36,7 +35,7 @@ export default {
|
||||
uA: 1e3,
|
||||
mA: 1e6,
|
||||
},
|
||||
defaultUnit: 'uA',
|
||||
defaultUnit: 'mA',
|
||||
downloadUnit: 'mA',
|
||||
},
|
||||
1: {
|
||||
|
||||
@@ -22,11 +22,10 @@ export default {
|
||||
us: 1,
|
||||
ms: 1e3,
|
||||
s: 1e6,
|
||||
m: 60 * 1e6,
|
||||
h: 60 * 60 * 1e6,
|
||||
auto: 1,
|
||||
minute: 60 * 1e6,
|
||||
hour: 60 * 60 * 1e6,
|
||||
},
|
||||
defaultUnit: 'auto',
|
||||
defaultUnit: 'ms',
|
||||
downloadUnit: 'ms',
|
||||
},
|
||||
0: {
|
||||
@@ -36,7 +35,7 @@ export default {
|
||||
uA: 1e3,
|
||||
mA: 1e6,
|
||||
},
|
||||
defaultUnit: 'uA',
|
||||
defaultUnit: 'mA',
|
||||
downloadUnit: 'mA',
|
||||
},
|
||||
1: {
|
||||
|
||||
@@ -22,11 +22,10 @@ export default {
|
||||
us: 1,
|
||||
ms: 1e3,
|
||||
s: 1e6,
|
||||
m: 60 * 1e6,
|
||||
h: 60 * 60 * 1e6,
|
||||
auto: 1,
|
||||
minute: 60 * 1e6,
|
||||
hour: 60 * 60 * 1e6,
|
||||
},
|
||||
defaultUnit: 'auto',
|
||||
defaultUnit: 'ms',
|
||||
downloadUnit: 'ms',
|
||||
},
|
||||
0: {
|
||||
@@ -36,7 +35,7 @@ export default {
|
||||
uA: 1e3,
|
||||
mA: 1e6,
|
||||
},
|
||||
defaultUnit: 'uA',
|
||||
defaultUnit: 'mA',
|
||||
downloadUnit: 'mA',
|
||||
},
|
||||
1: {
|
||||
|
||||
@@ -22,11 +22,10 @@ export default {
|
||||
us: 1,
|
||||
ms: 1e3,
|
||||
s: 1e6,
|
||||
m: 60 * 1e6,
|
||||
h: 60 * 60 * 1e6,
|
||||
auto: 1,
|
||||
minute: 60 * 1e6,
|
||||
hour: 60 * 60 * 1e6,
|
||||
},
|
||||
defaultUnit: 'auto',
|
||||
defaultUnit: 'ms',
|
||||
downloadUnit: 'ms',
|
||||
},
|
||||
0: {
|
||||
@@ -36,7 +35,7 @@ export default {
|
||||
uA: 1e3,
|
||||
mA: 1e6,
|
||||
},
|
||||
defaultUnit: 'uA',
|
||||
defaultUnit: 'mA',
|
||||
downloadUnit: 'mA',
|
||||
},
|
||||
1: {
|
||||
|
||||
@@ -38,11 +38,10 @@ export default {
|
||||
us: 1,
|
||||
ms: 1e3,
|
||||
s: 1e6,
|
||||
m: 60 * 1e6,
|
||||
h: 60 * 60 * 1e6,
|
||||
auto: 1,
|
||||
minute: 60 * 1e6,
|
||||
hour: 60 * 60 * 1e6,
|
||||
},
|
||||
defaultUnit: 'auto',
|
||||
defaultUnit: 'ms',
|
||||
downloadUnit: 'ms',
|
||||
},
|
||||
0: {
|
||||
@@ -52,7 +51,7 @@ export default {
|
||||
uA: 1e3,
|
||||
mA: 1e6,
|
||||
},
|
||||
defaultUnit: 'uA',
|
||||
defaultUnit: 'mA',
|
||||
downloadUnit: 'mA',
|
||||
},
|
||||
1: {
|
||||
@@ -62,7 +61,7 @@ export default {
|
||||
uA: 1e3,
|
||||
mA: 1e6,
|
||||
},
|
||||
defaultUnit: 'uA',
|
||||
defaultUnit: 'mA',
|
||||
downloadUnit: 'mA',
|
||||
},
|
||||
},
|
||||
|
||||
@@ -22,11 +22,10 @@ export default {
|
||||
us: 1,
|
||||
ms: 1e3,
|
||||
s: 1e6,
|
||||
m: 60 * 1e6,
|
||||
h: 60 * 60 * 1e6,
|
||||
auto: 1,
|
||||
minute: 60 * 1e6,
|
||||
hour: 60 * 60 * 1e6,
|
||||
},
|
||||
defaultUnit: 'auto',
|
||||
defaultUnit: 'ms',
|
||||
downloadUnit: 'ms',
|
||||
},
|
||||
0: {
|
||||
@@ -36,7 +35,7 @@ export default {
|
||||
uA: 1e3,
|
||||
mA: 1e6,
|
||||
},
|
||||
defaultUnit: 'uA',
|
||||
defaultUnit: 'mA',
|
||||
downloadUnit: 'mA',
|
||||
},
|
||||
1: {
|
||||
@@ -50,7 +49,7 @@ export default {
|
||||
downloadUnit: 'mV',
|
||||
},
|
||||
2: {
|
||||
name: 'Resister',
|
||||
name: 'Resistor',
|
||||
unit: {
|
||||
mΩ: 1,
|
||||
mohm: 1,
|
||||
|
||||
@@ -22,11 +22,10 @@ export default {
|
||||
us: 1,
|
||||
ms: 1e3,
|
||||
s: 1e6,
|
||||
m: 60 * 1e6,
|
||||
h: 60 * 60 * 1e6,
|
||||
auto: 1,
|
||||
minute: 60 * 1e6,
|
||||
hour: 60 * 60 * 1e6,
|
||||
},
|
||||
defaultUnit: 'auto',
|
||||
defaultUnit: 'ms',
|
||||
downloadUnit: 'ms',
|
||||
},
|
||||
0: {
|
||||
@@ -36,7 +35,7 @@ export default {
|
||||
uA: 1e3,
|
||||
mA: 1e6,
|
||||
},
|
||||
defaultUnit: 'uA',
|
||||
defaultUnit: 'mA',
|
||||
downloadUnit: 'mA',
|
||||
},
|
||||
1: {
|
||||
|
||||
@@ -58,7 +58,7 @@ export const dataStreamBuffer = {
|
||||
|
||||
into: (currentDataByChannel, currentDeviceID, currentChannel) => {
|
||||
// currentData = [ timeStart, d1, d2..... , timeEnd ]
|
||||
// const currentData = JSON.parse(currentDataByChannel).binary.split(' ')
|
||||
// const currentData = JSON.parse(currentDataByChannel).binary.split(' '))
|
||||
const currentData = currentDataByChannel.split(' ')
|
||||
// console.log(currentData)
|
||||
const timeStart = parseInt(currentData[0])
|
||||
@@ -109,7 +109,7 @@ export const dataStreamBuffer = {
|
||||
// pop the first batch data from datastream buffer
|
||||
pop: (chartID, deviceID, channel) => {
|
||||
if (_dataStreamBuffer[chartID] != null && _dataStreamBuffer[chartID][deviceID] != null &&
|
||||
_dataStreamBuffer[chartID][deviceID][channel] != null && _dataStreamBuffer[chartID][deviceID][channel].length > 0) {
|
||||
_dataStreamBuffer[chartID][deviceID][channel] != null && _dataStreamBuffer[chartID][deviceID][channel].length > 0) {
|
||||
return _dataStreamBuffer[chartID][deviceID][channel].shift()
|
||||
}
|
||||
return []
|
||||
|
||||
@@ -23,7 +23,24 @@ function getTime (val) {
|
||||
return label
|
||||
}
|
||||
|
||||
function newTooltip (chartID) {
|
||||
function getPhysicsQunatity (name) {
|
||||
const label = []
|
||||
name = name.split('_')
|
||||
for (let i = 0; i < name.length; i++) {
|
||||
if (name[i].includes('T')) {
|
||||
label.push('Time')
|
||||
} else if (name[i].includes('V')) {
|
||||
label.push('Voltage')
|
||||
} else if (name[i].includes('I')) {
|
||||
label.push('Current')
|
||||
} else if (name[i].includes('R')) {
|
||||
label.push('Impedance')
|
||||
}
|
||||
}
|
||||
return label
|
||||
}
|
||||
|
||||
function newTooltip (realTime) {
|
||||
return {
|
||||
hideDelay: 5000,
|
||||
trigger: 'axis',
|
||||
@@ -32,92 +49,48 @@ function newTooltip (chartID) {
|
||||
borderWidth: 1,
|
||||
borderRadius: 0,
|
||||
padding: 10,
|
||||
// axisPointer: {
|
||||
// type: 'cross',
|
||||
// animation: false,
|
||||
// label: {
|
||||
// backgroundColor: '#505765',
|
||||
// },
|
||||
// },
|
||||
|
||||
formatter: function (params) {
|
||||
if (params.length) {
|
||||
if (params[0].seriesName.split('_')[0] === 'T' && params[0].seriesName.split('_')[1] !== 'T') {
|
||||
params.unshift({ seriesName: 'Time', value: [null, getTime(parseFloat(params[0].value[0]))], color: '#5193f2' })
|
||||
} else if (params[0].seriesName.split('_')[0] !== 'T' && params[0].seriesName.split('_')[1] === 'T') {
|
||||
params.unshift({ seriesName: 'Time', value: [null, getTime(parseFloat(params[0].value[1]))], color: '#5193f2' })
|
||||
} else {
|
||||
params.unshift({ seriesName: 'Time', value: [null, getTime(parseFloat(params[0].value[2]))], color: '#5193f2' })
|
||||
}
|
||||
let tip = ''
|
||||
for (var i = 0; i < params.length; i++) {
|
||||
const param = params[i]
|
||||
const style = 'color: ' + param.color
|
||||
let value
|
||||
// console.log(param.value)
|
||||
if (param.seriesName === 'Time') {
|
||||
value = param.value[1]
|
||||
} else if (param.seriesName.split('_')[1] === 'T' && param.seriesName.split('_')[0] !== 'T') {
|
||||
const physicalQuantity = param.seriesName.split('_')[0][param.seriesName.split('_')[0].length - 1]
|
||||
if (physicalQuantity === 'V') {
|
||||
value = parseFloat(param.value[0]).toFixed(3) + ' μV'
|
||||
} else if (physicalQuantity === 'I') {
|
||||
value = parseFloat(param.value[0]).toFixed(3) + ' nA'
|
||||
} else if (physicalQuantity === 'R') {
|
||||
value = parseFloat(param.value[0]).toFixed(3) + ' mΩ'
|
||||
} else if (physicalQuantity === 'X' || physicalQuantity === 'Y' || physicalQuantity === 'Z' || physicalQuantity === 'M') {
|
||||
value = (parseFloat(param.value[0]) / 100).toFixed(3) + ' (g)'
|
||||
} else if (!isNaN(physicalQuantity)) {
|
||||
value = (parseFloat(param.value[0]) / 1000).toFixed(3) + ' (mV)'
|
||||
} else {
|
||||
value = parseFloat(param.value[0]).toFixed(3)
|
||||
}
|
||||
} else if (param.seriesName.split('_')[1] !== 'T' && param.seriesName.split('_')[0] === 'T') {
|
||||
const physicalQuantity = param.seriesName.split('_')[1][param.seriesName.split('_')[1].length - 1]
|
||||
if (physicalQuantity === 'V') {
|
||||
value = parseFloat(param.value[1]).toFixed(3) + ' μV'
|
||||
} else if (physicalQuantity === 'I') {
|
||||
value = parseFloat(param.value[1]).toFixed(3) + ' nA'
|
||||
} else if (physicalQuantity === 'R') {
|
||||
value = parseFloat(param.value[1]).toFixed(3) + ' mΩ'
|
||||
} else if (physicalQuantity === 'X' || physicalQuantity === 'Y' || physicalQuantity === 'Z' || physicalQuantity === 'M') {
|
||||
value = (parseFloat(param.value[1]) / 100).toFixed(3) + ' (g)'
|
||||
} else if (!isNaN(physicalQuantity)) {
|
||||
value = (parseFloat(param.value[1]) / 1000).toFixed(3) + ' (mV)'
|
||||
} else {
|
||||
value = parseFloat(param.value[1]).toFixed(3)
|
||||
}
|
||||
} else {
|
||||
let value1
|
||||
let value2
|
||||
if (param.seriesName.split('_')[0][param.seriesName.split('_')[0].length - 1] === 'V') {
|
||||
value1 = parseFloat(param.value[0]).toFixed(3) + ' μV'
|
||||
} else if (param.seriesName.split('_')[0][param.seriesName.split('_')[0].length - 1] === 'I') {
|
||||
value1 = parseFloat(param.value[0]).toFixed(3) + ' nA'
|
||||
} else if (param.seriesName.split('_')[0][param.seriesName.split('_')[0].length - 1] === 'R') {
|
||||
value1 = parseFloat(param.value[0]).toFixed(3) + ' mΩ'
|
||||
} else {
|
||||
value1 = parseFloat(param.value[0]).toFixed(3)
|
||||
}
|
||||
|
||||
if (param.seriesName.split('_')[1][param.seriesName.split('_')[1].length - 1] === 'V') {
|
||||
value2 = parseFloat(param.value[1]).toFixed(3) + ' μV'
|
||||
} else if (param.seriesName.split('_')[1][param.seriesName.split('_')[1].length - 1] === 'I') {
|
||||
value2 = parseFloat(param.value[1]).toFixed(3) + ' nA'
|
||||
} else if (param.seriesName.split('_')[1][param.seriesName.split('_')[1].length - 1] === 'R') {
|
||||
value2 = parseFloat(param.value[1]).toFixed(3) + ' mΩ'
|
||||
} else {
|
||||
value2 = parseFloat(param.value[1]).toFixed(3)
|
||||
}
|
||||
|
||||
value = value1 + ', ' + value2
|
||||
}
|
||||
tip += '<span style="' + style + '">' +
|
||||
param.seriesName +
|
||||
':</span><span style="' +
|
||||
style + '">' + value + '</span><br>'
|
||||
}
|
||||
return tip
|
||||
// params is empty
|
||||
if (!params.length && realTime.length) return params
|
||||
// params is unempty
|
||||
let tip = ''
|
||||
let param // find coressonding parameter to the channel
|
||||
let unitTable // unit is store in this object
|
||||
let physicsQunatity // type is store here
|
||||
let style // color
|
||||
let value // value on cursor
|
||||
const timeIndex = params[0].seriesName.split('_').findIndex(title => title === 'T')
|
||||
// (Default) Time
|
||||
if (timeIndex === -1) {
|
||||
value = getTime(parseFloat(params[0].value[2]))
|
||||
} else {
|
||||
value = getTime(parseFloat(params[0].value[timeIndex]))
|
||||
}
|
||||
tip += '<span style="color: #5193f2">' + 'Time: ' + value + '</span><br>'
|
||||
// (Manual) Voltage, Current, Impedance
|
||||
for (let gridIndex = 0; gridIndex < realTime.length; gridIndex++) {
|
||||
for (let channelIndex = 0; channelIndex < realTime[gridIndex].length; channelIndex++) {
|
||||
param = params.find(x => x.seriesName === realTime[gridIndex][channelIndex].name)
|
||||
if (param === undefined) continue
|
||||
|
||||
unitTable = realTime[gridIndex][channelIndex]
|
||||
style = 'color: ' + param.color
|
||||
physicsQunatity = getPhysicsQunatity(param.seriesName)
|
||||
|
||||
tip += '<span style="' + style + '">' + param.seriesName + ':<ul style = "list-style-type: disc; list-style-position: inside">'
|
||||
if (physicsQunatity[0] !== 'Time') {
|
||||
value = parseFloat(param.value[0] / unitTable.xValueScale[unitTable.xUnit]).toFixed(3) + unitTable.xUnit
|
||||
tip += '<li>' + physicsQunatity[0] + ' = ' + value + '</li>'
|
||||
}
|
||||
if (physicsQunatity[1] !== 'Time') {
|
||||
value = parseFloat(param.value[1] / unitTable.yValueScale[unitTable.yUnit]).toFixed(3) + unitTable.yUnit
|
||||
tip += '<li>' + physicsQunatity[1] + ' = ' + value + '</li>'
|
||||
}
|
||||
tip += '</ul></span>'
|
||||
}
|
||||
}
|
||||
return tip
|
||||
},
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1194,6 +1194,7 @@ function makeYAxis (gridIndex, type, channel) {
|
||||
// // // verticalAlign: 'bottom',
|
||||
// // },
|
||||
gridIndex: gridIndex,
|
||||
boundarygap: ['0%', '50%'],
|
||||
axisTick: { show: false },
|
||||
axisLine: { show: false }, // color: '#ccc' } },
|
||||
axisLabel: {
|
||||
@@ -1209,8 +1210,8 @@ function makeYAxis (gridIndex, type, channel) {
|
||||
// // },
|
||||
animation: false,
|
||||
scale: true,
|
||||
min: 'dataMin',
|
||||
max: 'dataMax',
|
||||
// min: 'dataMin',
|
||||
// max: 'dataMax',
|
||||
splitNumber: 3,
|
||||
// minInterval: 1,
|
||||
interval: null,
|
||||
|
||||
Reference in New Issue
Block a user