UNPKG

label-print-design

Version:

操作简单,组件丰富的一站式打印解决方案打印设计器

1 lines 6.42 kB
{"version":3,"file":"svg-bezier-curve.vue2.mjs","sources":["../../../../../../src/components/design/svg/svg-bezier-curve.vue"],"sourcesContent":["<template>\n <svg-base\n :element=\"element\"\n :svgOptions=\"svgOptions\"\n :draw=\"draw\"\n :dragStart=\"dragStart\"\n :dragIng=\"dragIng\"\n :dragEnd=\"dragEnd\"\n />\n</template>\n\n<script setup lang=\"ts\">\nimport { reactive } from 'vue-demi';\n\nimport * as d3Path from 'd3-path';\nimport { Path } from 'd3-path';\nimport { Line, MyElement, Point, PointLabel } from '@myprint/design/types/entity';\nimport { unit2px } from '@myprint/design/utils/devicePixelRatio';\nimport { moveableDragOffsetResize } from '@myprint/design/plugins/moveable/moveable';\nimport SvgBase from '@myprint/design/components/design/svg/svg-base.vue';\nimport { bezier2 } from '@myprint/design/utils/bezierUtil';\nimport { stringify } from '@myprint/design/utils/utils';\nimport { getRecursionParentPanel } from '@myprint/design/utils/elementUtil';\n\nconst props = withDefaults(defineProps<{\n element?: MyElement\n}>(), {\n element: () => ({} as MyElement)\n});\n\nlet path: Path;\n\nconst svgOptions = reactive({\n width: 0,\n height: 0,\n rotateControl: {},\n controlLine: [] as Array<Line>,\n centerPoint: {} as Point,\n // controlPointLineStart: {} as PointLabel,\n // controlPointLineEnd: {} as PointLabel,\n controlPoint: {} as PointLabel,\n // svg 形状点\n linePoints: [] as PointLabel[],\n allPoint: [] as Array<PointLabel>,\n drawAuxiliary: false\n});\n\nsvgOptions.width = unit2px(props.element.width, getRecursionParentPanel(props.element));\nsvgOptions.height = unit2px(props.element.height, getRecursionParentPanel(props.element));\n// console.log(svgOptions)\ninitPoint();\n\nfunction draw() {\n // console.log('draw', svgOptions.controlPointLineEnd.x)\n path = d3Path.path() as Path;\n \n path.moveTo(svgOptions.linePoints[0].x, svgOptions.linePoints[0].y);\n path.quadraticCurveTo(svgOptions.controlPoint.x, svgOptions.controlPoint.y, svgOptions.linePoints[1].x, svgOptions.linePoints[1].y);\n return path;\n}\n\nfunction initPoint() {\n const data = JSON.parse(props.element.data);\n svgOptions.linePoints = data.points;\n svgOptions.controlPoint = data.controlPoints[0];\n svgOptions.controlPoint.type = 'control';\n svgOptions.allPoint = [...svgOptions.linePoints, svgOptions.controlPoint];\n \n svgOptions.controlLine = [{ start: svgOptions.linePoints[0], end: svgOptions.controlPoint },\n { start: svgOptions.linePoints[1], end: svgOptions.controlPoint }];\n}\n\nfunction dragStart() {\n\n}\n\nfunction dragIng(subject: PointLabel, event, dx, dy) {\n // if (subject.type == 'control') {\n subject.x = event.x + dx;\n subject.y = event.y + dy;\n // }\n}\n\nfunction dragEnd() {\n const bezierProperties = bezier2(svgOptions.allPoint[0], svgOptions.allPoint[2], svgOptions.allPoint[1]);\n // console.log(bezierProperties)\n // console.log(\"Bezier curve height: \" + bezierProperties.height);\n // console.log(\"Lowest point on Bezier curve: \" + bezierProperties.minY);\n // console.log(\"Highest point on Bezier curve: \" + bezierProperties.maxY);\n // const rect = computedShapeBound(svgOptions.linePoints)\n moveableDragOffsetResize(bezierProperties.x, bezierProperties.y, bezierProperties.width, bezierProperties.height, props.element);\n \n svgOptions.width = bezierProperties.width;\n svgOptions.height = bezierProperties.height;\n // props.element.width = rect.width\n // 偏移svg\n for (let allPointElement of svgOptions.allPoint) {\n allPointElement.x -= bezierProperties.x;\n allPointElement.y -= bezierProperties.y;\n }\n \n props.element.data = stringify({ points: svgOptions.linePoints, controlPoints: [svgOptions.controlPoint] }, 'type');\n}\n\n</script>\n"],"names":[],"mappings":"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"}