diff options
| author | Terry Truong <terry06890@gmail.com> | 2022-10-10 21:47:32 +1100 |
|---|---|---|
| committer | Terry Truong <terry06890@gmail.com> | 2022-10-10 21:47:32 +1100 |
| commit | 4aa28afe7bead19f633e2ce8829a66b7c65ea746 (patch) | |
| tree | 41af85010b9a3a3d757e926109e62b9d29c14423 /src/components/TimeLine.vue | |
| parent | ceaa2b13c073dbd7e137a712ddac9f519ee9c05b (diff) | |
Prevent span-regions in baseline becoming too small to see
Diffstat (limited to 'src/components/TimeLine.vue')
| -rw-r--r-- | src/components/TimeLine.vue | 7 |
1 files changed, 3 insertions, 4 deletions
diff --git a/src/components/TimeLine.vue b/src/components/TimeLine.vue index 1c7dee6..12dd7bc 100644 --- a/src/components/TimeLine.vue +++ b/src/components/TimeLine.vue @@ -24,7 +24,7 @@ </text> </svg> <!-- Icons --> - <icon-button :size="30" class="absolute bottom-2 right-2 text-stone-50 bg-yellow-600" + <icon-button :size="30" class="absolute top-2 right-2 text-stone-50 bg-yellow-600" @click="onClose" title="Remove timeline"> <minus-icon/> </icon-button> @@ -33,7 +33,7 @@ <script setup lang="ts"> import {ref, onMounted, computed, watch} from 'vue'; -import {MIN_DATE, MAX_DATE} from '../lib'; +import {MIN_DATE, MAX_DATE, SCALES} from '../lib'; // Components import IconButton from './IconButton.vue'; // Icons @@ -78,7 +78,6 @@ onMounted(() => resizeObserver.observe(rootRef.value as HTMLElement)); // Vars const startDate = ref(props.initialStart); // Lowest date on displayed timeline const endDate = ref(props.initialEnd); -const SCALES = [200, 50, 10, 1, 0.2]; // The timeline get divided into units of SCALES[0], then SCALES[1], etc let scaleIdx = 0; // Index of current scale in SCALES const SCROLL_SHIFT_CHG = 0.2; // Proportion of timeline length to shift by upon scroll const ZOOM_RATIO = 1.5; // When zooming out, the timeline length gets multiplied by this ratio @@ -228,7 +227,7 @@ function zoomTimeline(frac: number){ scaleIdx++; } } else { - if (newDateLen / tickDiff < MIN_LAST_TICKS){ + if (availLen.value / tickDiff < MIN_LAST_TICKS){ console.log('INFO: Reached zoom in limit'); return; } |