269 lines
7.8 KiB
JavaScript
269 lines
7.8 KiB
JavaScript
import { fs, dialog } from '@tauri-apps/api';
|
||
import * as echarts from 'echarts';
|
||
import { invoke } from "@tauri-apps/api/tauri";
|
||
import { exit } from '@tauri-apps/api/process';
|
||
|
||
|
||
|
||
|
||
|
||
export default {
|
||
async handlekeydown(event) {
|
||
|
||
if (event.code == "Space") {
|
||
//datatosave 保存
|
||
console.log(this.datatosave)
|
||
var data = this.datatosave;
|
||
var xValues = []
|
||
|
||
var yValues = []
|
||
var lenthofdata = data.length
|
||
for (var i = 0; i < lenthofdata; i++) {
|
||
xValues.push(data[i][0]);
|
||
yValues.push(data[i][1]);
|
||
}
|
||
|
||
var lenth = xValues.length;
|
||
var strcsv = ""
|
||
for (var i = 0; i < lenth; i++) {
|
||
strcsv += xValues[i] + "," + yValues[i] + "\r\n";
|
||
|
||
|
||
}
|
||
await fs.writeFile(this.Pathtosave, strcsv);
|
||
// fs.writeFileSync(this.Pathtosave, strcsv);
|
||
this.nowNumber++;
|
||
this.Pathtosave = this.pathofdir + "/" + this.Filename + this.nowNumber + ".csv";
|
||
alert("保存" + this.Pathtosave + "成功")
|
||
|
||
|
||
}
|
||
},
|
||
setwavelength(data) {
|
||
|
||
this.option.xAxis.max = data.max;
|
||
this.option.xAxis.min = data.min;
|
||
|
||
const chartDom = this.$refs.chart;
|
||
let chart = echarts.getInstanceByDom(chartDom);
|
||
chart.setOption(this.option);
|
||
},
|
||
setplotname(params){
|
||
this.option.series[0].name=params.up;
|
||
this.option.legend.data[0]=params.up;
|
||
if (typeof params.donw!="undefined")
|
||
{
|
||
this.option.series[1].name=params.donw;
|
||
this.option.legend.data[1]=params.donw;
|
||
}else{
|
||
//如果大于1个数据 则删最后一个
|
||
if (this.option.series.length>1)
|
||
{
|
||
this.option.series.pop();
|
||
this.option.legend.data.pop();
|
||
}
|
||
|
||
}
|
||
|
||
const chartDom = this.$refs.chart;
|
||
let chart = echarts.getInstanceByDom(chartDom);
|
||
chart.setOption(this.option);
|
||
|
||
},
|
||
plotGraph(data, index) {
|
||
|
||
if (index>=1&&this.option.series.length < 2) {
|
||
this.option.series.push({
|
||
data: [], // 使用二维数组表示数据点的坐标
|
||
type: 'line',
|
||
name: 'DOWN',
|
||
symbol: 'none', // 不显示数据点
|
||
smooth: false, // 不使用平滑处理
|
||
//step: 'start' // 设置 step 类型的起始位置
|
||
});
|
||
}
|
||
|
||
|
||
this.option.series[index].data = data;
|
||
|
||
|
||
const chartDom = this.$refs.chart;
|
||
|
||
let chart = echarts.getInstanceByDom(chartDom);
|
||
chart.setOption(this.option);
|
||
},
|
||
setprogressbar(message) {
|
||
|
||
if (typeof message === 'undefined') return;
|
||
if (typeof message === 'object') {
|
||
if (typeof message.percent === 'undefined') message.percent = this.percent;
|
||
if (typeof message.info === 'undefined') message.info = this.progressinfo;
|
||
|
||
this.percent = message.percent;
|
||
this.progressinfo = message.info;
|
||
}
|
||
|
||
let percent = this.percent;
|
||
//如果percent >0 且小于100
|
||
if (percent > 0 && percent < 100) {
|
||
this.progressstate = true;
|
||
} else {
|
||
this.progressstate = false;
|
||
}
|
||
|
||
|
||
|
||
},
|
||
initChart() {
|
||
const chartDom = this.$refs.chart;
|
||
// chartDom.style.width = '100%';
|
||
// chartDom.style.height = '100%';
|
||
let chart = echarts.init(chartDom,null,{renderer: 'svg'});
|
||
|
||
|
||
this.option = {
|
||
legend: {
|
||
data: ['UP', 'DOWN'], // 图例名称
|
||
show: true,// 显示图例
|
||
selectedMode: 'multiple', // 图例的选择模式。默认开启图例开关，可选single，multiple
|
||
},
|
||
// ECharts 配置选项
|
||
xAxis: {
|
||
type: 'value',
|
||
boundaryGap: false,// 显示连续的刻度
|
||
min: 0,
|
||
max: 1100,
|
||
dataZoom: [
|
||
{
|
||
type: 'inside', // 内置数据区域缩放
|
||
start: 0, // 初始缩放范围的起始位置（0%）
|
||
end: 100 // 初始缩放范围的结束位置（100%）
|
||
}
|
||
],
|
||
triggerEvent: true
|
||
},
|
||
animation: false,
|
||
yAxis: {
|
||
type: 'value',
|
||
//min:0,
|
||
},
|
||
tooltip:{
|
||
trigger:'axis',
|
||
|
||
|
||
|
||
|
||
},
|
||
axisPointer: {
|
||
link: { xAxisIndex: 'all' },
|
||
label: {
|
||
backgroundColor: '#777'
|
||
}
|
||
},
|
||
grid: {
|
||
left: '5%',
|
||
right: '5%',
|
||
bottom: '5%',
|
||
top: '5%',
|
||
|
||
},
|
||
// visualMap: [
|
||
// {
|
||
// type: 'continuous',
|
||
// }
|
||
// ],
|
||
dataZoom: [
|
||
{
|
||
type: 'slider', // 内置数据区域缩放，包括滚轮缩放
|
||
xAxisIndex: [0], // 对应 x 轴
|
||
filterMode: 'none' // 不过滤数据
|
||
|
||
},
|
||
{
|
||
type: 'slider', // 内置数据区域缩放，包括滚轮缩放
|
||
yAxisIndex: [0], // 对应 y 轴
|
||
filterMode: 'none', // 不过滤数据
|
||
//width :15
|
||
|
||
}
|
||
],
|
||
|
||
|
||
// legend: {
|
||
// data: ['曲线'], // 图例名称
|
||
// show: true ,// 显示图例
|
||
// //selectedMode: 'multiple', // 图例的选择模式。默认开启图例开关，可选single，multiple
|
||
// },
|
||
series: [
|
||
{
|
||
data: [], // 使用二维数组表示数据点的坐标
|
||
type: 'line',
|
||
name: 'UP',
|
||
symbol: 'none', // 不显示数据点
|
||
smooth: false, // 不使用平滑处理
|
||
// step: 'start' // 设置 step 类型的起始位置
|
||
},
|
||
{
|
||
data: [], // 使用二维数组表示数据点的坐标
|
||
type: 'line',
|
||
name: 'DOWN',
|
||
symbol: 'none', // 不显示数据点
|
||
smooth: false, // 不使用平滑处理
|
||
//step: 'start' // 设置 step 类型的起始位置
|
||
}
|
||
]
|
||
};
|
||
|
||
|
||
|
||
window.onresize=function () {
|
||
chart.resize()
|
||
}
|
||
chart.setOption(this.option);
|
||
chart.on('click', function (params) {
|
||
console.log(params);
|
||
});
|
||
chart.on('legendselectchanged', function (params) {
|
||
console.log(params);
|
||
});
|
||
|
||
chart.on('click', 'series.line', function (params) {
|
||
console.log(params);
|
||
});
|
||
|
||
chart.on('mouseover', {seriesIndex: 1, name: 'xx'}, function (params) {
|
||
console.log(params);
|
||
});
|
||
//this.echartresize()
|
||
},
|
||
echartresize(){
|
||
console.log("resize")
|
||
const chartDom = this.$refs.chart;
|
||
let chart = echarts.getInstanceByDom(chartDom);
|
||
chart.resize();
|
||
let width=chartDom.clientWidth;
|
||
if (width<800)
|
||
{
|
||
let option =this.option;
|
||
option.grid.left="10%";
|
||
chart.setOption(option);
|
||
}else{
|
||
let option =this.option;
|
||
option.grid.left="5%";
|
||
chart.setOption(option);
|
||
}
|
||
},
|
||
|
||
|
||
GetSenSorInfo() {
|
||
var Command = { command: "get_sensor_info" };
|
||
let data = {
|
||
data: Command.toString(),
|
||
datatype: "json"
|
||
}
|
||
SerilPort.SendtoPort(data)
|
||
console.log(SerilPort.ReadData(0x01));
|
||
}
|
||
|
||
}
|