fix(background): set default offset to 0 (#1692)
* fix(background): correct offset Signed-off-by: braks <78412429+bcakmakoglu@users.noreply.github.com> * chore(changeset): add Signed-off-by: braks <78412429+bcakmakoglu@users.noreply.github.com> --------- Signed-off-by: braks <78412429+bcakmakoglu@users.noreply.github.com>
This commit is contained in:
@@ -0,0 +1,5 @@
|
|||||||
|
---
|
||||||
|
"@vue-flow/background": patch
|
||||||
|
---
|
||||||
|
|
||||||
|
Set default offset value to `0`
|
||||||
@@ -9,7 +9,6 @@
|
|||||||
|
|
||||||
body {
|
body {
|
||||||
color: #111;
|
color: #111;
|
||||||
padding: 5px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#root {
|
#root {
|
||||||
|
|||||||
@@ -18,21 +18,19 @@ const {
|
|||||||
bgColor,
|
bgColor,
|
||||||
patternColor: initialPatternColor,
|
patternColor: initialPatternColor,
|
||||||
color: _patternColor,
|
color: _patternColor,
|
||||||
offset = 2,
|
offset = 0,
|
||||||
} = defineProps<BackgroundProps>()
|
} = defineProps<BackgroundProps>()
|
||||||
|
|
||||||
const { id: vueFlowId, viewport } = useVueFlow()
|
const { id: vueFlowId, viewport } = useVueFlow()
|
||||||
|
|
||||||
const background = computed(() => {
|
const background = computed(() => {
|
||||||
|
const zoom = viewport.value.zoom
|
||||||
const [gapX, gapY] = Array.isArray(gap) ? gap : [gap, gap]
|
const [gapX, gapY] = Array.isArray(gap) ? gap : [gap, gap]
|
||||||
const scaledGap: [number, number] = [gapX * viewport.value.zoom || 1, gapY * viewport.value.zoom || 1]
|
const scaledGap: [number, number] = [gapX * zoom || 1, gapY * zoom || 1]
|
||||||
const scaledSize = size * viewport.value.zoom
|
const scaledSize = size * zoom
|
||||||
const [offsetX, offsetY]: [number, number] = Array.isArray(offset) ? offset : [offset, offset]
|
const [offsetX, offsetY]: [number, number] = Array.isArray(offset) ? offset : [offset, offset]
|
||||||
|
|
||||||
const scaledOffset: [number, number] = [
|
const scaledOffset: [number, number] = [offsetX * zoom || 1 + scaledGap[0] / 2, offsetY * zoom || 1 + scaledGap[1] / 2]
|
||||||
offsetX * viewport.value.zoom || 1 + scaledGap[0] / 2,
|
|
||||||
offsetY * viewport.value.zoom || 1 + scaledGap[1] / 2,
|
|
||||||
]
|
|
||||||
|
|
||||||
return {
|
return {
|
||||||
scaledGap,
|
scaledGap,
|
||||||
|
|||||||
Reference in New Issue
Block a user