From 399407b15aa9290f7e7d2bf7f5815f46e6923bb5 Mon Sep 17 00:00:00 2001 From: garrettmills Date: Sun, 10 Apr 2022 07:31:12 -0500 Subject: [PATCH] Fix missing scope for chart function evaluation --- deploy/deploy.yaml | 4 +-- src/components/RangeChart.vue | 47 ++++++++++++++++++++--------------- src/pages/Editor.vue | 1 + src/support/page.ts | 1 + src/support/types.ts | 1 + 5 files changed, 32 insertions(+), 22 deletions(-) diff --git a/deploy/deploy.yaml b/deploy/deploy.yaml index 406e37c..c581728 100644 --- a/deploy/deploy.yaml +++ b/deploy/deploy.yaml @@ -56,7 +56,7 @@ spec: - name: DATABASE_NAME value: mathy ports: - - containerPort: 80 + - containerPort: 8000 - name: redis image: redis:latest @@ -73,7 +73,7 @@ spec: - name: http port: 80 protocol: TCP - targetPort: 80 + targetPort: 8000 selector: name: mathy-api --- diff --git a/src/components/RangeChart.vue b/src/components/RangeChart.vue index 6a6b870..d6ac897 100644 --- a/src/components/RangeChart.vue +++ b/src/components/RangeChart.vue @@ -3,10 +3,11 @@ import * as math from 'mathjs' import { v4 as uuidv4 } from 'uuid' import { LineChart } from 'vue-chart-3' import { computed, ref } from 'vue' -import { Chart, ChartData, ChartOptions, registerables } from 'chart.js' +import { Chart, ChartData, registerables } from 'chart.js' import { MathStatement } from '../support/parse' import { ChartBox } from '../support/types' import { stepX, stepY } from '../support/const' +import {MathPage} from '../support/page' Chart.register(...registerables) @@ -17,6 +18,7 @@ const emit = defineEmits<{ }>() const props = defineProps<{ + page: MathPage, fn: MathStatement, value: ChartBox, }>() @@ -69,27 +71,32 @@ const getChartData = (): ChartData<'line'> => { throw new TypeError('Cannot chart node that is not a function.') } - const node = props.fn.parse() as math.FunctionAssignmentNode - const fn = node.compile().evaluate() // FIXME need dependencies in scope + try { + const evaluationResult = props.page.evaluate() + const node = props.fn.parse() as math.FunctionAssignmentNode + const fn = node.compile().evaluate(evaluationResult.scope) - console.log('getChartData', { - labels: range.map(x => `${x}`), - datasets: [ - { + return { + labels: range.map(x => `${x}`), + datasets: [{ label: node.name, - data: range.map(n => fn(n)), - }, - ], - }) - return { - labels: range.map(x => `${x}`), - datasets: [{ - label: node.name, - backgroundColor: '#553564', - borderColor: '#ccc', - data: range.map(x => fn(x)), - pointRadius: 5 - }], + backgroundColor: '#553564', + borderColor: '#ccc', + data: range.map(x => fn(x)), + pointRadius: 5 + }], + } + } catch (_) { + return { + labels: [], + datasets: [{ + label: '', + backgroundColor: '#553564', + borderColor: '#ccc', + data: [], + pointRadius: 5 + }], + } } } diff --git a/src/pages/Editor.vue b/src/pages/Editor.vue index c8b9f36..11c7cce 100644 --- a/src/pages/Editor.vue +++ b/src/pages/Editor.vue @@ -515,6 +515,7 @@ onMounted(() => { & string export interface EvaluationResult { variables: Record statements: Record + scope: Record }