File size: 1,174 Bytes
89ce340 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 |
<template>
<svg
class="formula-content"
overflow="visible"
:width="box.w + 32"
:height="box.h + 32"
stroke="#000"
stroke-width="1"
fill="none"
stroke-linecap="round"
stroke-linejoin="round"
>
<g
:transform="`scale(${scale}, ${scale}) translate(0,0) matrix(1,0,0,1,0,0)`"
transform-origin="0 50%"
>
<path :d="pathd"></path>
</g>
</svg>
</template>
<script lang="ts" setup>
import { computed, ref, watch } from 'vue'
import { hfmath } from './hfmath'
const props = defineProps<{
latex: string
width: number
height: number
}>()
const box = ref({ x: 0, y: 0, w: 0, h: 0 })
const pathd = ref('')
watch(() => props.latex, () => {
const eq = new hfmath(props.latex)
pathd.value = eq.pathd({})
box.value = eq.box({})
}, { immediate: true })
const scale = computed(() => {
const boxW = box.value.w + 32
const boxH = box.value.h + 32
if (boxW > props.width || boxH > props.height) {
if (boxW / boxH > props.width / props.height) return props.width / boxW
return props.height / boxH
}
return 1
})
</script>
<style lang="scss" scoped>
svg {
overflow: hidden;
}
</style> |