comments, remove bbox
This commit is contained in:
parent
af6694f890
commit
1ce3b244f0
1 changed files with 3 additions and 16 deletions
|
@ -4,7 +4,7 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import {defineComponent, onMounted, reactive, ref} from "vue";
|
import {defineComponent, onMounted, ref} from "vue";
|
||||||
import createPanZoom, {PanZoom} from "panzoom";
|
import createPanZoom, {PanZoom} from "panzoom";
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
|
@ -18,16 +18,9 @@ export default defineComponent({
|
||||||
setup(props) {
|
setup(props) {
|
||||||
const root = ref(null);
|
const root = ref(null);
|
||||||
const panzoom = ref<null | PanZoom>(null);
|
const panzoom = ref<null | PanZoom>(null);
|
||||||
const bbox = reactive({
|
|
||||||
x: 0,
|
|
||||||
y: 0,
|
|
||||||
width: undefined,
|
|
||||||
height: undefined
|
|
||||||
});
|
|
||||||
const anchors = ref<SVGRectElement[]>([]);
|
const anchors = ref<SVGRectElement[]>([]);
|
||||||
const panToAnchor = ref();
|
const panToAnchor = ref();
|
||||||
|
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
const element = root.value as unknown as HTMLDivElement;
|
const element = root.value as unknown as HTMLDivElement;
|
||||||
|
|
||||||
|
@ -36,20 +29,14 @@ export default defineComponent({
|
||||||
const svgParsed = new DOMParser().parseFromString(await fetchResult.text(), "image/svg+xml") as Document;
|
const svgParsed = new DOMParser().parseFromString(await fetchResult.text(), "image/svg+xml") as Document;
|
||||||
const svg = element.appendChild(svgParsed.firstElementChild as Element) as any;
|
const svg = element.appendChild(svgParsed.firstElementChild as Element) as any;
|
||||||
|
|
||||||
|
// PanZoom
|
||||||
const pz = createPanZoom(element, {
|
const pz = createPanZoom(element, {
|
||||||
smoothScroll: false,
|
smoothScroll: false,
|
||||||
zoomSpeed: 0.05
|
zoomSpeed: 0.05
|
||||||
});
|
});
|
||||||
panzoom.value = pz;
|
panzoom.value = pz;
|
||||||
|
|
||||||
function updateBBox(panzoom: PanZoom) {
|
// Anchors
|
||||||
const transform = panzoom.getTransform();
|
|
||||||
// console.log(transform);
|
|
||||||
}
|
|
||||||
|
|
||||||
updateBBox(pz);
|
|
||||||
pz.on("transform", updateBBox);
|
|
||||||
|
|
||||||
anchors.value = processAnchors(svg);
|
anchors.value = processAnchors(svg);
|
||||||
panToAnchor.value = (anchor: SVGRectElement) => {
|
panToAnchor.value = (anchor: SVGRectElement) => {
|
||||||
const transform = pz.getTransform();
|
const transform = pz.getTransform();
|
||||||
|
|
Loading…
Reference in a new issue