Commit ec209968 authored by Mohammad Nakhaee's avatar Mohammad Nakhaee
Browse files

Simplify the examples and handle the errors

parent dcafaca3
Pipeline #132555 passed with stages
in 40 minutes and 58 seconds
......@@ -953,7 +953,13 @@ const XYPlot = React.memo(function XYPlot({plot, section, sectionDef, title}) {
const toUnit = path => {
const relativePath = path.replace('./', '')
const resolvedQuantityDef = resolveRef(relativePath, sectionDef)
if (resolvedQuantityDef === undefined || resolvedQuantityDef === null) {
throw new Error(`Could not resolve the path ${path}`)
}
const value = resolveRef(relativePath, section)
if (value === undefined || value === null) {
throw new Error(`Could not resolve the data for ${path}`)
}
const unit = resolvedQuantityDef?.unit
if (unit) {
const quantity = new Q(value, unit).toSystem(units)
......@@ -991,7 +997,8 @@ const XYPlot = React.memo(function XYPlot({plot, section, sectionDef, title}) {
try {
[yValues, yUnit] = toUnit(y)
} catch (e) {
return [{error: e.message}, undefined]
data = {error: e.message}
return
}
const yPath = y.split('/')
const yLabel = titleCase(yPath[yPath.length - 1])
......@@ -1006,8 +1013,19 @@ const XYPlot = React.memo(function XYPlot({plot, section, sectionDef, title}) {
yLabels.push(yLabel)
})
const getColor = index => {
const line = lines[index]
if ('mode' in line) {
if (line.mode === 'lines') {
return {color: line.line?.color}
} else if (line.mode === 'markers') {
return {color: line.marker?.color}
}
}
return {color: '#000000'}
}
const sameUnit = yUnits.every(unit => unit === yUnits[0])
const color = {color: lines[0].marker?.color || lines[0].line?.color}
let layout = {
xaxis: {
......@@ -1015,8 +1033,8 @@ const XYPlot = React.memo(function XYPlot({plot, section, sectionDef, title}) {
},
yaxis: {
title: sameUnit ? `${titleCase(title)} (${yUnits[0]})` : (yUnits[0] ? `${yLabels[0]} (${yUnits[0]})` : yLabels[0]),
titlefont: !sameUnit && nLines > 1 ? color : undefined,
tickfont: !sameUnit && nLines > 1 ? color : undefined
titlefont: !sameUnit && nLines > 1 ? getColor(0) : undefined,
tickfont: !sameUnit && nLines > 1 ? getColor(0) : undefined
},
showlegend: sameUnit && nLines > 1,
legend: {
......@@ -1028,7 +1046,7 @@ const XYPlot = React.memo(function XYPlot({plot, section, sectionDef, title}) {
if (!sameUnit) {
Y.forEach((y, index) => {
const color = {color: lines[index].marker?.color || lines[index].line?.color}
const color = getColor(index)
if (index > 0) {
layout[`yaxis${index + 1}`] = {
title: yUnits[index] ? `${yLabels[index]} (${yUnits[index]})` : yLabels[index],
......
......@@ -48,27 +48,34 @@ Example.propTypes = {
children: PropTypes.any
}
const customPlotInit = {
a_plot: {
label: 'T_substrate',
x: 'process_time',
y: './substrate_temperature'
}
}
const examples = [{
plot: {
a_plot: {
label: 'T_substrate',
x: 'process_time',
y: ['./set_substrate_temperature', './substrate_temperature']
}
}, {
plot: {
a_plot: {
x: 'process_time',
y: ['./substrate_temperature', './chamber_pressure']
}
}, {
plot: [{
a_plot: [{
label: 'Temperature and Pressure',
x: 'process_time',
y: ['./substrate_temperature', './chamber_pressure'],
lines: [{
mode: 'markers',
marker: {
color: 'rgb(40, 80, 130)',
size: 10
color: 'rgb(40, 80, 130)'
}}, {
mode: 'lines',
line: {
......@@ -80,23 +87,23 @@ const examples = [{
x: 'process_time',
y: 'chamber_pressure',
layout: {
xaxis: {title: 'x'},
yaxis: {title: 'y'}
xaxis: {title: 't (sec)'},
yaxis: {title: 'P (GPa)'}
}
}]
}]
export function PlotExamples() {
const [metainfo, setMetainfo] = useState()
const [customPlot, setCustomPlot] = useState(examples[0])
const [customPlot, setCustomPlot] = useState(customPlotInit)
useEffect(() => {
createGlobalMetainfo(metainfoData).then(setMetainfo)
}, [customPlot])
const sectionDef = useMemo(() => metainfo ? resolveRef('/packages/7/section_definitions/4', metainfo._data) : undefined, [metainfo]) // Path for PVDEvaporation
const exampleSectionDefs = useMemo(() => examples.map(example => ({...sectionDef, 'm_annotations': example})), [sectionDef])
const customSectionDef = useMemo(() => ({...sectionDef, 'm_annotations': customPlot}), [customPlot, sectionDef])
const exampleSectionDefs = useMemo(() => examples.map(example => ({...sectionDef, m_annotations: {plot: example.a_plot}})), [sectionDef])
const customSectionDef = useMemo(() => ({...sectionDef, m_annotations: {plot: customPlot.a_plot}}), [customPlot, sectionDef])
const handleJsonChange = useCallback((data) => {
setCustomPlot(data)
......@@ -109,7 +116,7 @@ export function PlotExamples() {
<Grid container direction="column" spacing={1}>
{exampleSectionDefs.map((def, index) => (
<Grid item key={index}>
<Example code={JSON.stringify(def['m_annotations'], null, 2)}>
<Example code={JSON.stringify(examples[index], null, 2)}>
<SectionPlots sectionDef={def} section={section} />
</Example>
</Grid>
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment