fix: 优化gamma主图表逻辑
This commit is contained in:
parent
ad2a550668
commit
bdaf65ca99
|
|
@ -99,6 +99,7 @@ export function findSeriesByName(series, seriesName) {
|
|||
* 限定数字在一定范围
|
||||
* @param {Number} min
|
||||
* @param {Number} max
|
||||
* @returns {(num: number) => number }
|
||||
*/
|
||||
export function rangeNumber(min, max) {
|
||||
return num => {
|
||||
|
|
|
|||
|
|
@ -119,154 +119,7 @@ import NuclideReviewModal from './components/Modals/AnalyzeInteractiveToolModal/
|
|||
import CompareFileListModal from './components/Modals/CompareFileListModal.vue'
|
||||
import ReProcessingModal from './components/Modals/ReProcessingModal/index.vue'
|
||||
|
||||
// 初始配置
|
||||
const initialOption = {
|
||||
grid: {
|
||||
top: 40,
|
||||
left: 60,
|
||||
right: 50,
|
||||
containLabel: true,
|
||||
},
|
||||
title: {
|
||||
text: '',
|
||||
left: 'center',
|
||||
bottom: 10,
|
||||
textStyle: {
|
||||
color: '#8FD4F8',
|
||||
rich: {
|
||||
a: {
|
||||
padding: [0, 20, 0, 0],
|
||||
fontSize: 16,
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
lineStyle: {
|
||||
color: '#3CAEBB',
|
||||
width: 1,
|
||||
type: 'solid',
|
||||
},
|
||||
},
|
||||
formatter: undefined,
|
||||
className: 'figure-chart-option-tooltip',
|
||||
},
|
||||
xAxis: {
|
||||
name: 'Channel',
|
||||
nameTextStyle: {
|
||||
color: '#8FD4F8',
|
||||
fontSize: 16,
|
||||
align: 'right',
|
||||
verticalAlign: 'top',
|
||||
padding: [30, 0, 0, 0],
|
||||
},
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: '#ade6ee',
|
||||
},
|
||||
},
|
||||
splitLine: {
|
||||
show: false,
|
||||
},
|
||||
axisLabel: {
|
||||
textStyle: {
|
||||
color: '#ade6ee',
|
||||
},
|
||||
},
|
||||
min: 1,
|
||||
max: 'dataMax',
|
||||
animation: false,
|
||||
axisLabel: {
|
||||
formatter: (value) => {
|
||||
return parseInt(value)
|
||||
},
|
||||
},
|
||||
},
|
||||
yAxis: {
|
||||
name: 'Counts',
|
||||
type: 'value',
|
||||
nameTextStyle: {
|
||||
color: '#8FD4F8',
|
||||
fontSize: 16,
|
||||
},
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: '#ade6ee',
|
||||
},
|
||||
},
|
||||
splitLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: 'rgba(173, 230, 238, .2)',
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
textStyle: {
|
||||
color: '#ade6ee',
|
||||
},
|
||||
},
|
||||
min: 1,
|
||||
max: 'dataMax',
|
||||
animation: false,
|
||||
axisLabel: {
|
||||
formatter: (value) => {
|
||||
return value.toFixed(1)
|
||||
},
|
||||
},
|
||||
},
|
||||
series: [],
|
||||
brush: {},
|
||||
}
|
||||
|
||||
// 缩略图配置
|
||||
const thumbnailOption = {
|
||||
grid: {
|
||||
top: 0,
|
||||
left: 5,
|
||||
right: 5,
|
||||
bottom: 0,
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
axisLine: {
|
||||
show: false,
|
||||
},
|
||||
splitLine: {
|
||||
show: false,
|
||||
},
|
||||
axisLabel: {
|
||||
show: false,
|
||||
},
|
||||
min: 1,
|
||||
max: 'dataMax',
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
axisLine: {
|
||||
show: false,
|
||||
},
|
||||
splitLine: {
|
||||
show: false,
|
||||
},
|
||||
axisLabel: {
|
||||
show: false,
|
||||
},
|
||||
min: 1,
|
||||
max: 'dataMax',
|
||||
},
|
||||
series: [],
|
||||
}
|
||||
|
||||
const graphAssistance = {
|
||||
axisType: 'Channel',
|
||||
spectrumType: 'Lines',
|
||||
Baseline: true,
|
||||
SCAC: true,
|
||||
Lc: true,
|
||||
}
|
||||
import { GammaOptions, graphAssistance } from './settings'
|
||||
|
||||
export default {
|
||||
props: {
|
||||
|
|
@ -290,19 +143,35 @@ export default {
|
|||
return {
|
||||
isLoading: false,
|
||||
isLoadingNuclide: false,
|
||||
option: cloneDeep(initialOption),
|
||||
option: cloneDeep(GammaOptions.option),
|
||||
opts: {
|
||||
notMerge: false,
|
||||
},
|
||||
thumbnailOption: cloneDeep(thumbnailOption),
|
||||
thumbnailOption: cloneDeep(GammaOptions.thumbnailOption),
|
||||
|
||||
detailedInfomation: [],
|
||||
qcFlags: [],
|
||||
graphAssistance: cloneDeep(graphAssistance),
|
||||
nuclideLibraryVisible: false,
|
||||
|
||||
channelPeakGroup: [],
|
||||
energyPeakGroup: [],
|
||||
channelData: {
|
||||
peakGroup: [],
|
||||
spectrumLine: null,
|
||||
baseLine: null,
|
||||
lcLine: null,
|
||||
scacLine: null,
|
||||
all: null,
|
||||
baseLineCP: [],
|
||||
},
|
||||
energyData: {
|
||||
peakGroup: [],
|
||||
spectrumLine: null,
|
||||
baseLine: null,
|
||||
lcLine: null,
|
||||
scacLine: null,
|
||||
all: null,
|
||||
baseLineCP: [],
|
||||
},
|
||||
|
||||
nuclideLibraryList: [], // 当前鼠标点击选中的channel
|
||||
peakInfomationTooltip: {
|
||||
|
|
@ -326,6 +195,8 @@ export default {
|
|||
},
|
||||
created() {
|
||||
this.option.title.text = '{a|Channel:0} {a|Energy:0} {a|Counts:0} {a|Detectability:0}'
|
||||
this.option.tooltip.formatter = this.tooltipFormatter
|
||||
|
||||
this.$bus.$on('colorChange', this.handleColorChange)
|
||||
this.$bus.$on('gammaRefresh', this.handleRefresh)
|
||||
this.$bus.$on('accept', this.handleAccept)
|
||||
|
|
@ -339,6 +210,7 @@ export default {
|
|||
this.option.brush = { toolbox: [] }
|
||||
},
|
||||
methods: {
|
||||
// 获取样品详情
|
||||
async getSampleDetail() {
|
||||
const { dbName, sampleId } = this.sample
|
||||
try {
|
||||
|
|
@ -348,13 +220,7 @@ export default {
|
|||
|
||||
// const { success, result, message } = Response
|
||||
|
||||
if (this._cancelToken && typeof this._cancelToken == 'function') {
|
||||
this._cancelToken()
|
||||
}
|
||||
|
||||
const cancelToken = new axios.CancelToken((c) => {
|
||||
this._cancelToken = c
|
||||
})
|
||||
const cancelToken = this.cancelLastRequest()
|
||||
|
||||
const { success, result, message } = await getAction(
|
||||
'/gamma/gammaByDB',
|
||||
|
|
@ -381,9 +247,15 @@ export default {
|
|||
this.isLoading = true
|
||||
this.handleResetState()
|
||||
// const { success, result, message } = Response
|
||||
const { success, result, message } = await getAction('/gamma/gammaByFile', {
|
||||
fileName,
|
||||
})
|
||||
const cancelToken = this.cancelLastRequest()
|
||||
|
||||
const { success, result, message } = await getAction(
|
||||
'/gamma/gammaByFile',
|
||||
{
|
||||
fileName,
|
||||
},
|
||||
cancelToken
|
||||
)
|
||||
console.log('%c [ result ]-243', 'font-size:13px; background:pink; color:#bf2c9f;', result)
|
||||
if (success) {
|
||||
this.dataProsess(result)
|
||||
|
|
@ -395,6 +267,16 @@ export default {
|
|||
}
|
||||
},
|
||||
|
||||
cancelLastRequest() {
|
||||
if (this._cancelToken && typeof this._cancelToken == 'function') {
|
||||
this._cancelToken()
|
||||
}
|
||||
|
||||
return new axios.CancelToken((c) => {
|
||||
this._cancelToken = c
|
||||
})
|
||||
},
|
||||
|
||||
dataProsess(result) {
|
||||
this.isLoading = false
|
||||
|
||||
|
|
@ -419,44 +301,40 @@ export default {
|
|||
this.detailedInfomation = DetailedInformation
|
||||
this.qcFlags = QCFlag
|
||||
|
||||
const channelPeakGroup = allData.filter((item) => item.name == 'Peak' && item.group == 'channel')
|
||||
const energyPeakGroup = allData.filter((item) => item.name == 'Peak' && item.group == 'energy')
|
||||
const channelPeakGroup = this.getLineData(allData, 'Peak', 'channel', true)
|
||||
const energyPeakGroup = this.getLineData(allData, 'Peak', 'energy', true)
|
||||
|
||||
const channelBaseLine = allData.find((item) => item.name == 'BaseLine' && item.group == 'channel') || {}
|
||||
const energyBaseLine = allData.find((item) => item.name == 'BaseLine' && item.group == 'energy')
|
||||
const channelBaseLine = this.getLineData(allData, 'BaseLine', 'channel')
|
||||
const energyBaseLine = this.getLineData(allData, 'BaseLine', 'energy')
|
||||
|
||||
const channelLcLine = allData.find((item) => item.name == 'Lc' && item.group == 'channel') || {}
|
||||
const energyLcLine = allData.find((item) => item.name == 'Lc' && item.group == 'energy')
|
||||
const channelLcLine = this.getLineData(allData, 'Lc', 'channel')
|
||||
const energyLcLine = this.getLineData(allData, 'Lc', 'energy')
|
||||
|
||||
const channelScacLine = allData.find((item) => item.name == 'Scac' && item.group == 'channel') || {}
|
||||
const energyScacLine = allData.find((item) => item.name == 'Scac' && item.group == 'energy')
|
||||
const channelScacLine = this.getLineData(allData, 'Scac', 'channel')
|
||||
const energyScacLine = this.getLineData(allData, 'Scac', 'energy')
|
||||
|
||||
this.allEnergy = allData.find((item) => item.name == 'Energy' && item.group == 'energy') || {}
|
||||
this.allChannel = allData.find((item) => item.name == 'Count' && item.group == 'channel')
|
||||
const allChannel = this.getLineData(allData, 'Count', 'channel')
|
||||
const allEnergy = this.getLineData(allData, 'Energy', 'energy')
|
||||
|
||||
// 保存Peak Line
|
||||
this.channelPeakGroup = channelPeakGroup
|
||||
this.energyPeakGroup = energyPeakGroup
|
||||
this.channelData = {
|
||||
peakGroup: channelPeakGroup,
|
||||
spectrumLine: shadowChannelChart,
|
||||
baseLine: channelBaseLine,
|
||||
lcLine: channelLcLine,
|
||||
scacLine: channelScacLine,
|
||||
all: allChannel,
|
||||
baseLineCP: shapeChannelData,
|
||||
}
|
||||
|
||||
// 保存 Spectrum Line
|
||||
this.shadowChannelChart = shadowChannelChart
|
||||
this.shadowEnergyChart = shadowEnergyChart
|
||||
|
||||
// 保存基线
|
||||
this.channelBaseLine = channelBaseLine
|
||||
this.energyBaseLine = energyBaseLine
|
||||
|
||||
// 保存Lc
|
||||
this.channelLcLine = channelLcLine
|
||||
this.energyLcLine = energyLcLine
|
||||
|
||||
// 保存Scac
|
||||
this.channelScacLine = channelScacLine
|
||||
this.energyScacLine = energyScacLine
|
||||
|
||||
// 保存 基线控制点
|
||||
this.shapeChannelData = shapeChannelData
|
||||
this.shapeEnergyData = shapeEnergyData
|
||||
this.energyData = {
|
||||
peakGroup: energyPeakGroup,
|
||||
spectrumLine: shadowEnergyChart,
|
||||
baseLine: energyBaseLine,
|
||||
lcLine: energyLcLine,
|
||||
scacLine: energyScacLine,
|
||||
all: allEnergy,
|
||||
baseLineCP: shapeEnergyData,
|
||||
}
|
||||
|
||||
this.resetThumbnailChartDataMax()
|
||||
const series = []
|
||||
|
|
@ -465,7 +343,7 @@ export default {
|
|||
series.push(
|
||||
buildLineSeries(
|
||||
'Spectrum',
|
||||
shadowChannelChart.pointlist && shadowChannelChart.pointlist.map(({ x, y }) => [x, y]),
|
||||
this.transformPointListData(shadowChannelChart.pointlist),
|
||||
shadowChannelChart.color,
|
||||
{
|
||||
symbolSize: 2,
|
||||
|
|
@ -485,65 +363,33 @@ export default {
|
|||
)
|
||||
)
|
||||
|
||||
// 右上角缩略图推入Spectrum Line
|
||||
this.thumbnailOption.series.push(
|
||||
buildLineSeries(
|
||||
'Spectrum',
|
||||
shadowChannelChart.pointlist && shadowChannelChart.pointlist.map(({ x, y }) => [x, y]),
|
||||
shadowChannelChart.color,
|
||||
{
|
||||
silent: true,
|
||||
markLine: {
|
||||
silent: true,
|
||||
symbol: 'none',
|
||||
label: {
|
||||
show: false,
|
||||
},
|
||||
lineStyle: {
|
||||
type: 'solid',
|
||||
color: '#1397a3',
|
||||
width: 1,
|
||||
},
|
||||
data: [],
|
||||
},
|
||||
}
|
||||
)
|
||||
// 右上角缩略图设置Spectrum Line 数据
|
||||
this.setSeriesData(
|
||||
this.thumbnailOption.series,
|
||||
'Spectrum',
|
||||
this.transformPointListData(shadowChannelChart.pointlist),
|
||||
shadowChannelChart.color
|
||||
)
|
||||
|
||||
// 推入BaseLine
|
||||
series.push(
|
||||
buildLineSeries(
|
||||
'BaseLine',
|
||||
channelBaseLine.pointlist && channelBaseLine.pointlist.map(({ x, y }) => [x, y]),
|
||||
channelBaseLine.color,
|
||||
{
|
||||
zlevel: 2,
|
||||
}
|
||||
)
|
||||
buildLineSeries('BaseLine', this.transformPointListData(channelBaseLine.pointlist), channelBaseLine.color, {
|
||||
zlevel: 2,
|
||||
})
|
||||
)
|
||||
|
||||
// 推入LcLine线
|
||||
series.push(
|
||||
buildLineSeries(
|
||||
'LcLine',
|
||||
channelLcLine.pointlist && channelLcLine.pointlist.map(({ x, y }) => [x, y]),
|
||||
channelLcLine.color,
|
||||
{
|
||||
zlevel: 3,
|
||||
}
|
||||
)
|
||||
buildLineSeries('LcLine', this.transformPointListData(channelLcLine.pointlist), channelLcLine.color, {
|
||||
zlevel: 3,
|
||||
})
|
||||
)
|
||||
|
||||
// 推入Scac线
|
||||
series.push(
|
||||
buildLineSeries(
|
||||
'ScacLine',
|
||||
channelScacLine.pointlist && channelScacLine.pointlist.map(({ x, y }) => [x, y]),
|
||||
channelScacLine.color,
|
||||
{
|
||||
zlevel: 4,
|
||||
}
|
||||
)
|
||||
buildLineSeries('ScacLine', this.transformPointListData(channelScacLine.pointlist), channelScacLine.color, {
|
||||
zlevel: 4,
|
||||
})
|
||||
)
|
||||
|
||||
// 推入基线控制点
|
||||
|
|
@ -571,14 +417,9 @@ export default {
|
|||
const peakLines = []
|
||||
channelPeakGroup.forEach((item, index) => {
|
||||
peakLines.push(
|
||||
buildLineSeries(
|
||||
`Peak_${index}`,
|
||||
item.pointlist.map(({ x, y }) => [x, y]),
|
||||
item.color,
|
||||
{
|
||||
zlevel: 6,
|
||||
}
|
||||
)
|
||||
buildLineSeries(`Peak_${index}`, this.transformPointListData(item.pointlist), item.color, {
|
||||
zlevel: 6,
|
||||
})
|
||||
)
|
||||
})
|
||||
series.push(...peakLines)
|
||||
|
|
@ -591,25 +432,26 @@ export default {
|
|||
)
|
||||
|
||||
this.option.series = series
|
||||
|
||||
this.option.tooltip.formatter = this.tooltipFormatter
|
||||
},
|
||||
|
||||
// chart 的 tooltip
|
||||
tooltipFormatter(params) {
|
||||
if (this.isEnergy()) {
|
||||
const energy = params[0].value[0]
|
||||
const channel = this.getChannelByEnergy(energy)
|
||||
let channel = 0
|
||||
let energy = 0
|
||||
const value = params[0].value[0]
|
||||
|
||||
return `<div class="channel">Channel: ${channel}</div>
|
||||
<div class="energy">Energy: ${energy.toFixed(2)}</div>`
|
||||
if (this.isEnergy()) {
|
||||
energy = value.toFixed(2)
|
||||
channel = this.getChannelByEnergy(energy)
|
||||
} else {
|
||||
const channel = parseInt(params[0].value[0].toFixed())
|
||||
const energy = this.allEnergy.pointlist && this.allEnergy.pointlist[channel - 1]
|
||||
return energy
|
||||
? `<div class="channel">Channel: ${channel}</div>
|
||||
<div class="energy">Energy: ${energy.x.toFixed(2)}</div>`
|
||||
: undefined
|
||||
const allPointList = this.energyData.all.pointlist
|
||||
channel = parseInt(value.toFixed())
|
||||
energy = allPointList && allPointList[channel - 1]
|
||||
energy = energy ? energy.x.toFixed(2) : undefined
|
||||
}
|
||||
|
||||
return `<div class="channel">Channel: ${channel}</div>
|
||||
<div class="energy">Energy: ${energy}</div>`
|
||||
},
|
||||
|
||||
// Graph Assistance 操作
|
||||
|
|
@ -640,19 +482,24 @@ export default {
|
|||
|
||||
this.redrawLineBySeriesName(
|
||||
'BaseLine',
|
||||
this.energyBaseLine,
|
||||
this.channelBaseLine,
|
||||
this.energyData.baseLine,
|
||||
this.channelData.baseLine,
|
||||
this.graphAssistance.Baseline
|
||||
)
|
||||
this.redrawLineBySeriesName('LcLine', this.energyLcLine, this.channelLcLine, this.graphAssistance.Lc)
|
||||
this.redrawLineBySeriesName(
|
||||
'LcLine',
|
||||
this.energyData.lcLine,
|
||||
this.channelData.lcLine,
|
||||
this.graphAssistance.Lc
|
||||
)
|
||||
this.redrawLineBySeriesName(
|
||||
'ScacLine',
|
||||
this.energyScacLine,
|
||||
this.channelScacLine,
|
||||
this.energyData.scacLine,
|
||||
this.channelData.scacLine,
|
||||
this.graphAssistance.SCAC
|
||||
)
|
||||
|
||||
this.redrawLineBySeriesName('Spectrum', this.shadowEnergyChart, this.shadowChannelChart)
|
||||
this.redrawLineBySeriesName('Spectrum', this.energyData.spectrumLine, this.channelData.spectrumLine)
|
||||
this.redrawCtrlPointBySeriesName()
|
||||
this.redrawPeakLine()
|
||||
|
||||
|
|
@ -674,7 +521,7 @@ export default {
|
|||
compareLineSeries.type = 'line'
|
||||
compareLineSeries.symbol = 'none'
|
||||
|
||||
this.redrawLineBySeriesName('Spectrum', this.shadowEnergyChart, this.shadowChannelChart)
|
||||
this.redrawLineBySeriesName('Spectrum', this.energyData.spectrumLine, this.channelData.spectrumLine)
|
||||
|
||||
if (this.channelCompareLine) {
|
||||
this.redrawLineBySeriesName('Compare', this.energyCompareLine, this.channelCompareLine)
|
||||
|
|
@ -712,13 +559,13 @@ export default {
|
|||
}
|
||||
break
|
||||
case 'Baseline':
|
||||
this.redrawLineBySeriesName('BaseLine', this.energyBaseLine, this.channelBaseLine, value)
|
||||
this.redrawLineBySeriesName('BaseLine', this.energyData.baseLine, this.channelData.baseLine, value)
|
||||
break
|
||||
case 'Lc':
|
||||
this.redrawLineBySeriesName('LcLine', this.energyLcLine, this.channelLcLine, value)
|
||||
this.redrawLineBySeriesName('LcLine', this.energyData.lcLine, this.channelData.lcLine, value)
|
||||
break
|
||||
case 'SCAC':
|
||||
this.redrawLineBySeriesName('ScacLine', this.energyScacLine, this.channelScacLine, value)
|
||||
this.redrawLineBySeriesName('ScacLine', this.energyData.scacLine, this.channelData.scacLine, value)
|
||||
break
|
||||
}
|
||||
}
|
||||
|
|
@ -730,22 +577,18 @@ export default {
|
|||
|
||||
// 根据seriesName重绘线
|
||||
redrawLineBySeriesName(seriesName, energyData, channelData, isShow = true, color) {
|
||||
const series = findSeriesByName(this.option.series, seriesName)
|
||||
if (isShow) {
|
||||
const data = this.isEnergy() ? energyData : channelData
|
||||
series.data = data.pointlist.map(({ x, y }) => [x, y])
|
||||
this.setSeriesData(this.option.series, seriesName, this.transformPointListData(data.pointlist), color)
|
||||
} else {
|
||||
series.data = []
|
||||
}
|
||||
if (color) {
|
||||
series.itemStyle.color = color
|
||||
this.setSeriesData(this.option.series, seriesName, [])
|
||||
}
|
||||
},
|
||||
|
||||
// 重绘控制点
|
||||
redrawCtrlPointBySeriesName() {
|
||||
const series = findSeriesByName(this.option.series, 'BaseLine_Ctrl_Point')
|
||||
const data = this.isEnergy() ? this.shapeEnergyData : this.shapeChannelData
|
||||
const data = this.isEnergy() ? this.energyData.baseLineCP : this.channelData.baseLineCP
|
||||
series.data = data.map(({ size, color, point: { x, y } }) => {
|
||||
return {
|
||||
value: [x, y],
|
||||
|
|
@ -764,18 +607,13 @@ export default {
|
|||
return !item.name.includes('Peak_')
|
||||
})
|
||||
|
||||
const data = this.isEnergy() ? this.energyPeakGroup : this.channelPeakGroup
|
||||
const data = this.isEnergy() ? this.energyData.peakGroup : this.channelData.peakGroup
|
||||
const peakLines = []
|
||||
data.forEach((item, index) => {
|
||||
peakLines.push(
|
||||
buildLineSeries(
|
||||
`Peak_${index}`,
|
||||
item.pointlist.map(({ x, y }) => [x, y]),
|
||||
item.color,
|
||||
{
|
||||
zlevel: 6,
|
||||
}
|
||||
)
|
||||
buildLineSeries(`Peak_${index}`, this.transformPointListData(item.pointlist), item.color, {
|
||||
zlevel: 6,
|
||||
})
|
||||
)
|
||||
})
|
||||
|
||||
|
|
@ -785,8 +623,8 @@ export default {
|
|||
// 重绘右上角的缩略图
|
||||
redrawThumbnailChart() {
|
||||
const series = findSeriesByName(this.thumbnailOption.series, 'Spectrum')
|
||||
const data = this.isEnergy() ? this.shadowEnergyChart : this.shadowChannelChart
|
||||
series.data = data.pointlist.map(({ x, y }) => [x, y])
|
||||
const data = this.isEnergy() ? this.energyData.spectrumLine : this.channelData.spectrumLine
|
||||
series.data = this.transformPointListData(data.pointlist)
|
||||
},
|
||||
|
||||
// 点击图表，设置红线
|
||||
|
|
@ -801,8 +639,10 @@ export default {
|
|||
const channel = this.isEnergy() ? this.getChannelByEnergy(xAxis) : parseInt(xAxis.toFixed())
|
||||
const energy = this.isEnergy()
|
||||
? xAxis.toFixed(2)
|
||||
: this.allEnergy.pointlist && this.allEnergy.pointlist[channel - 1].x.toFixed(2)
|
||||
const counts = this.isEnergy() ? this.allEnergy.pointlist[channel - 1] : this.allChannel.pointlist[channel - 1]
|
||||
: this.energyData.all.pointlist && this.energyData.all.pointlist[channel - 1].x.toFixed(2)
|
||||
const counts = this.isEnergy()
|
||||
? this.energyData.all.pointlist[channel - 1]
|
||||
: this.channelData.all.pointlist[channel - 1]
|
||||
this.option.title.text = `{a|Channel:${channel}} {a|Energy:${energy}} {a|Counts:${counts.y}} {a|Detectability:0}`
|
||||
|
||||
this.getSelPosNuclide(channel)
|
||||
|
|
@ -864,7 +704,7 @@ export default {
|
|||
const spectrumLineSeries = findSeriesByName(this.option.series, 'Spectrum')
|
||||
const xAxis = spectrumLineSeries.markLine.data[0].xAxis
|
||||
const channel = this.isEnergy() ? this.getChannelByEnergy(xAxis) : parseInt(xAxis.toFixed())
|
||||
const index = this.channelPeakGroup.findIndex((peakItem) => {
|
||||
const index = this.channelData.peakGroup.findIndex((peakItem) => {
|
||||
const allX = peakItem.pointlist.map((item) => item.x)
|
||||
const max = Math.max(...allX)
|
||||
const min = Math.min(...allX)
|
||||
|
|
@ -887,7 +727,7 @@ export default {
|
|||
})
|
||||
if (success) {
|
||||
const html = result.replaceAll('\n', '<br>')
|
||||
const currPeak = this.channelPeakGroup[index]
|
||||
const currPeak = this.channelData.peakGroup[index]
|
||||
const { x, y } = currPeak.pointlist.reduce((prev, curr) => {
|
||||
return prev && prev.y > curr.y ? prev : curr
|
||||
})
|
||||
|
|
@ -919,7 +759,7 @@ export default {
|
|||
const prevAxis = spectrumLineSeries.markLine.data[0].xAxis
|
||||
|
||||
// 获取每一段 Channel 中的最大值
|
||||
const maxXAxises = this.channelPeakGroup.map((item) => {
|
||||
const maxXAxises = this.channelData.peakGroup.map((item) => {
|
||||
const allY = item.pointlist.map((item) => item.y)
|
||||
const max = item.pointlist.find((point) => point.y == Math.max(...allY))
|
||||
return max.x
|
||||
|
|
@ -978,7 +818,6 @@ export default {
|
|||
// 改为不可刷选状态
|
||||
chart.dispatchAction({
|
||||
type: 'takeGlobalCursor',
|
||||
brushOption: false
|
||||
})
|
||||
},
|
||||
|
||||
|
|
@ -1058,16 +897,16 @@ export default {
|
|||
const y2 = getAxisMax(chart, 'yAxis')
|
||||
|
||||
const channelSpectrumData = {
|
||||
...this.shadowChannelChart,
|
||||
...this.channelData.spectrumLine,
|
||||
pointlist: isReset
|
||||
? this.pointlistLimitY(this.shadowChannelChart.pointlist)
|
||||
: this.pointlistLimit(this.shadowChannelChart.pointlist, x1, x2, y1, y2),
|
||||
? this.pointlistLimitY(this.channelData.spectrumLine.pointlist)
|
||||
: this.pointlistLimit(this.channelData.spectrumLine.pointlist, x1, x2, y1, y2),
|
||||
}
|
||||
const energySpectrumData = {
|
||||
...this.shadowEnergyChart,
|
||||
...this.energyData.spectrumLine,
|
||||
pointlist: isReset
|
||||
? this.pointlistLimitY(this.shadowEnergyChart.pointlist)
|
||||
: this.pointlistLimit(this.shadowEnergyChart.pointlist, x1, x2, y1, y2),
|
||||
? this.pointlistLimitY(this.energyData.spectrumLine.pointlist)
|
||||
: this.pointlistLimit(this.energyData.spectrumLine.pointlist, x1, x2, y1, y2),
|
||||
}
|
||||
this.redrawLineBySeriesName('Spectrum', energySpectrumData, channelSpectrumData)
|
||||
|
||||
|
|
@ -1171,8 +1010,8 @@ export default {
|
|||
this.setThumbnailChartRect(xAxis - halfWidth, maxYAxis, xAxis + halfWidth, minYAxis)
|
||||
|
||||
if (this.isEnergy()) {
|
||||
const x1 = parseInt(this.shadowEnergyChart.pointlist[xAxis - halfWidth].x)
|
||||
const x2 = parseInt(this.shadowEnergyChart.pointlist[xAxis + halfWidth].x)
|
||||
const x1 = parseInt(this.energyData.spectrumLine.pointlist[xAxis - halfWidth].x)
|
||||
const x2 = parseInt(this.energyData.spectrumLine.pointlist[xAxis + halfWidth].x)
|
||||
|
||||
this.option.xAxis.min = x1
|
||||
this.option.xAxis.max = x2
|
||||
|
|
@ -1190,7 +1029,9 @@ export default {
|
|||
}
|
||||
},
|
||||
|
||||
// 重置
|
||||
/**
|
||||
* 重置图表
|
||||
*/
|
||||
handleResetChart() {
|
||||
this.option.xAxis.min = 1
|
||||
this.option.xAxis.max = 'dataMax'
|
||||
|
|
@ -1291,12 +1132,16 @@ export default {
|
|||
// this.reprocessingModalVisible = true
|
||||
},
|
||||
|
||||
// 重置缩略图表y轴最大值
|
||||
/**
|
||||
* 重置缩略图表y轴最大值
|
||||
*/
|
||||
resetThumbnailChartDataMax() {
|
||||
this.thumbnailOption.yAxis.max = 'dataMax'
|
||||
},
|
||||
|
||||
// 重置图表配置
|
||||
/**
|
||||
* 重置图表配置
|
||||
*/
|
||||
resetChartOpts() {
|
||||
this.opts.notMerge = false
|
||||
this.option.brush = { toolbox: [] }
|
||||
|
|
@ -1318,12 +1163,17 @@ export default {
|
|||
]
|
||||
},
|
||||
|
||||
/**
|
||||
* 根据energy获取channel
|
||||
* @param {number} energy
|
||||
*/
|
||||
getChannelByEnergy(energy) {
|
||||
let channel = 0
|
||||
for (let index = 1; index < this.allEnergy.pointlist.length; index++) {
|
||||
const currEnergy = this.allEnergy.pointlist[index].x
|
||||
const pointlist = this.energyData.all.pointlist
|
||||
for (let index = 1; index < pointlist.length; index++) {
|
||||
const currEnergy = pointlist[index].x
|
||||
if (currEnergy >= energy) {
|
||||
const prevEnergy = this.allEnergy.pointlist[index - 1].x
|
||||
const prevEnergy = pointlist[index - 1].x
|
||||
if (currEnergy - energy > energy - prevEnergy.x) {
|
||||
channel = index
|
||||
} else {
|
||||
|
|
@ -1335,13 +1185,16 @@ export default {
|
|||
return channel
|
||||
},
|
||||
|
||||
// 重置页面信息
|
||||
/**
|
||||
* 重置页面信息
|
||||
*/
|
||||
handleResetState() {
|
||||
this.handleResetChart()
|
||||
|
||||
this.selectedChannel = -1
|
||||
this.nuclideLibraryList = []
|
||||
this.closePeakInfomationTooltip()
|
||||
this.option.series = []
|
||||
this.thumbnailOption.series = []
|
||||
this.option.xAxis.name = 'Channel'
|
||||
this.option.yAxis.type = 'value'
|
||||
|
||||
|
|
@ -1352,14 +1205,17 @@ export default {
|
|||
spectrumLineSeries.markLine.lineStyle.width = 2
|
||||
}
|
||||
|
||||
if (this.thumbnailOption.series.length) {
|
||||
const thumbnailSpectrumLineSeries = findSeriesByName(this.thumbnailOption.series, 'Spectrum')
|
||||
thumbnailSpectrumLineSeries.type = 'line'
|
||||
thumbnailSpectrumLineSeries.symbol = 'none'
|
||||
}
|
||||
const thumbnailSpectrumLineSeries = findSeriesByName(this.thumbnailOption.series, 'Spectrum')
|
||||
thumbnailSpectrumLineSeries.type = 'line'
|
||||
thumbnailSpectrumLineSeries.symbol = 'none'
|
||||
|
||||
this.graphAssistance = cloneDeep(graphAssistance)
|
||||
},
|
||||
|
||||
/**
|
||||
* 颜色改变
|
||||
* @param {*} colorConfig
|
||||
*/
|
||||
handleColorChange(colorConfig) {
|
||||
// 如果还没加载完，加载新的
|
||||
if (this.isLoading) {
|
||||
|
|
@ -1376,22 +1232,22 @@ export default {
|
|||
const { Color_Spec, Color_Peak, Color_Lc, Color_Base, Color_Scac, Color_Compare, Color_Strip, Color_Fitbase } =
|
||||
colorConfig
|
||||
|
||||
this.shadowChannelChart.color = Color_Spec
|
||||
this.shadowEnergyChart.color = Color_Spec
|
||||
this.channelData.spectrumLine.color = Color_Spec
|
||||
this.energyData.spectrumLine.color = Color_Spec
|
||||
|
||||
for (let i = 0; i < this.channelPeakGroup.length; i++) {
|
||||
this.channelPeakGroup[i].color = Color_Peak
|
||||
this.energyPeakGroup[i].color = Color_Peak
|
||||
for (let i = 0; i < this.channelData.peakGroup.length; i++) {
|
||||
this.channelData.peakGroup[i].color = Color_Peak
|
||||
this.energyData.peakGroup[i].color = Color_Peak
|
||||
}
|
||||
|
||||
this.channelLcLine.color = Color_Lc
|
||||
this.energyLcLine.color = Color_Lc
|
||||
this.channelData.lcLine.color = Color_Lc
|
||||
this.energyData.lcLine.color = Color_Lc
|
||||
|
||||
this.channelBaseLine.color = Color_Base
|
||||
this.energyBaseLine.color = Color_Base
|
||||
this.channelData.baseLine.color = Color_Base
|
||||
this.energyData.baseLine.color = Color_Base
|
||||
|
||||
this.channelScacLine.color = Color_Scac
|
||||
this.energyScacLine.color = Color_Scac
|
||||
this.channelData.scacLine.color = Color_Scac
|
||||
this.energyData.scacLine.color = Color_Scac
|
||||
|
||||
if (this.channelCompareLine) {
|
||||
this.channelCompareLine.color = Color_Compare
|
||||
|
|
@ -1409,7 +1265,11 @@ export default {
|
|||
thumbnailChartSeries.itemStyle.color = Color_Spec
|
||||
},
|
||||
|
||||
// 根据series名修改颜色
|
||||
/**
|
||||
* 根据series名修改颜色
|
||||
* @param {*} seriesName
|
||||
* @param {*} color
|
||||
*/
|
||||
changeColorBySeriesName(seriesName, color) {
|
||||
const series = findSeriesByName(this.option.series, seriesName)
|
||||
series.itemStyle.color = color
|
||||
|
|
@ -1439,6 +1299,38 @@ export default {
|
|||
getThumbnailChart() {
|
||||
return this.$refs.thumbnailChartRef.getChartInstance()
|
||||
},
|
||||
|
||||
/**
|
||||
* 设置图表数据和颜色
|
||||
*/
|
||||
setSeriesData(series, seriesName, data, color) {
|
||||
const find = findSeriesByName(series, seriesName)
|
||||
find.data = data
|
||||
if (color) {
|
||||
find.itemStyle.color = color
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 转换pointlist类型数据到series的data可用的数据
|
||||
*/
|
||||
transformPointListData(pointlist) {
|
||||
if (!pointlist) {
|
||||
return []
|
||||
}
|
||||
return pointlist.map(({ x, y }) => [x, y])
|
||||
},
|
||||
|
||||
/**
|
||||
* 在返回的allData中查找指定的数据
|
||||
* @param {Array} allData
|
||||
* @param {*} name
|
||||
* @param {*} group
|
||||
*/
|
||||
getLineData(allData, name, group, isList = false) {
|
||||
const arrFunc = isList ? Array.prototype.filter : Array.prototype.find
|
||||
return arrFunc.call(allData, (item) => item.name == name && item.group == group) || {}
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
sample: {
|
||||
|
|
|
|||
|
|
@ -432,7 +432,7 @@ export default {
|
|||
})
|
||||
arr.forEach((item) => {
|
||||
item.dbName = ''
|
||||
item.sampleId = ''
|
||||
item.sampleId = null
|
||||
item.inputFileName = item.sampleFileName
|
||||
item.sampleType = item.sampleSystemType
|
||||
})
|
||||
|
|
|
|||
167
src/views/spectrumAnalysis/settings.js
Normal file
167
src/views/spectrumAnalysis/settings.js
Normal file
|
|
@ -0,0 +1,167 @@
|
|||
import { buildLineSeries } from "@/utils/chartHelper"
|
||||
|
||||
export const GammaOptions = {
|
||||
option: {
|
||||
grid: {
|
||||
top: 40,
|
||||
left: 60,
|
||||
right: 50,
|
||||
containLabel: true
|
||||
},
|
||||
title: {
|
||||
text: '',
|
||||
left: 'center',
|
||||
bottom: 10,
|
||||
textStyle: {
|
||||
color: '#8FD4F8',
|
||||
rich: {
|
||||
a: {
|
||||
padding: [0, 20, 0, 0],
|
||||
fontSize: 16
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
lineStyle: {
|
||||
color: '#3CAEBB',
|
||||
width: 1,
|
||||
type: 'solid'
|
||||
}
|
||||
},
|
||||
formatter: undefined,
|
||||
className: 'figure-chart-option-tooltip'
|
||||
},
|
||||
xAxis: {
|
||||
name: 'Channel',
|
||||
nameTextStyle: {
|
||||
color: '#8FD4F8',
|
||||
fontSize: 16,
|
||||
align: 'right',
|
||||
verticalAlign: 'top',
|
||||
padding: [30, 0, 0, 0]
|
||||
},
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: '#ade6ee'
|
||||
}
|
||||
},
|
||||
splitLine: {
|
||||
show: false
|
||||
},
|
||||
axisLabel: {
|
||||
textStyle: {
|
||||
color: '#ade6ee'
|
||||
}
|
||||
},
|
||||
min: 1,
|
||||
max: 'dataMax',
|
||||
animation: false,
|
||||
axisLabel: {
|
||||
formatter: value => {
|
||||
return parseInt(value)
|
||||
}
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
name: 'Counts',
|
||||
type: 'value',
|
||||
nameTextStyle: {
|
||||
color: '#8FD4F8',
|
||||
fontSize: 16
|
||||
},
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: '#ade6ee'
|
||||
}
|
||||
},
|
||||
splitLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: 'rgba(173, 230, 238, .2)'
|
||||
}
|
||||
},
|
||||
axisLabel: {
|
||||
textStyle: {
|
||||
color: '#ade6ee'
|
||||
}
|
||||
},
|
||||
min: 1,
|
||||
max: 'dataMax',
|
||||
animation: false,
|
||||
axisLabel: {
|
||||
formatter: value => {
|
||||
return value.toFixed(1)
|
||||
}
|
||||
}
|
||||
},
|
||||
series: [],
|
||||
brush: {}
|
||||
},
|
||||
// 缩略图配置
|
||||
thumbnailOption: {
|
||||
grid: {
|
||||
top: 0,
|
||||
left: 5,
|
||||
right: 5,
|
||||
bottom: 0
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
axisLine: {
|
||||
show: false
|
||||
},
|
||||
splitLine: {
|
||||
show: false
|
||||
},
|
||||
axisLabel: {
|
||||
show: false
|
||||
},
|
||||
min: 1,
|
||||
max: 'dataMax'
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
axisLine: {
|
||||
show: false
|
||||
},
|
||||
splitLine: {
|
||||
show: false
|
||||
},
|
||||
axisLabel: {
|
||||
show: false
|
||||
},
|
||||
min: 1,
|
||||
max: 'dataMax'
|
||||
},
|
||||
series: [
|
||||
buildLineSeries('Spectrum', [], '#fff', {
|
||||
silent: true,
|
||||
markLine: {
|
||||
silent: true,
|
||||
symbol: 'none',
|
||||
label: {
|
||||
show: false
|
||||
},
|
||||
lineStyle: {
|
||||
type: 'solid',
|
||||
color: '#1397a3',
|
||||
width: 1
|
||||
},
|
||||
data: []
|
||||
}
|
||||
})
|
||||
]
|
||||
}
|
||||
}
|
||||
|
||||
export const graphAssistance = {
|
||||
axisType: 'Channel',
|
||||
spectrumType: 'Lines',
|
||||
Baseline: true,
|
||||
SCAC: true,
|
||||
Lc: true,
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user