leaflet-ant-path icon indicating copy to clipboard operation
leaflet-ant-path copied to clipboard

Bug: strange delay speed for some lines

Open SAbolfazlSH opened this issue 1 year ago β€’ 0 comments

Type:

  • [x] bug

Environment:

  • OS: Windows10, Linux
  • Browser: firefox(last version), chrome(last version), ...
  • Library Version: 1.3.0

Description: hey everyone I hope your doing great recently i used this library in my project, but i found a critical bug in delay option of lines sometimes some lines will display at a strange and different delay speed after the map and AntPath will loading I made sure that my code does not have any bug so i wrote this static example for testing and it does not have any different when the page will refresh or this trigger button will pressed, this bug will happening sometimes anyway

bug: main

the vue3 code:

<template>
  <div>
    <button @click="trigger">{{ display ? 'show' : 'hide' }}</button>
    <div v-if="display" id="map" :style="{height: '300px', width: '300px'}"></div>
  </div>
</template>

<script setup>
import leaflet from 'leaflet'
import { AntPath } from 'leaflet-ant-path'
import { onMounted, ref, nextTick } from 'vue'

const display = ref(true)

const trigger = () => {
  display.value = !display.value
  if(display.value) nextTick(() => { init() })
}

const init = () => {
  const map = leaflet.map('map', {
    minZoom: 3,
    maxZoom: 23,
    fullscreenControl: true,
    drawControl: true
  }).setView([35.6996774, 51.3376701], 11);

  leaflet.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
    maxZoom:19,
    minZoom: 1,
    attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
  }).addTo(map);
  map.addLayer(new AntPath([{lat: 35.72488256155388, lng: 51.41975477778468}, {lat: 35.72484256186000, lng: 51.41979000000000}], { delay: 100 }))
  map.addLayer(new AntPath([{lat: 35.72484256186000, lng: 51.41979000000000}, {lat: 35.72494256186000, lng: 51.41979000000000}], { delay: 10000 }))
  map.addLayer(new AntPath([{lat: 35.72494256186000, lng: 51.41979000000000}, {lat: 35.72494256186000, lng: 51.41990000000000}], { delay: 100 }))
  map.addLayer(new AntPath([{lat: 35.72494256186000, lng: 51.41990000000000}, {lat: 35.72496256186000, lng: 51.41980000000000}], { delay: 10000 }))
  map.fitBounds([
    {lat: 35.72484256155388, lng: 51.41976477778468}, {lat: 35.72484256186000, lng: 51.41979000000000},
    {lat: 35.72494256186000, lng: 51.41979000000000}, {lat: 35.72494256186000, lng: 51.41990000000000}
  ], { padding: [60, 60] });
}
onMounted(init)
</script>

SAbolfazlSH avatar Jan 01 '24 10:01 SAbolfazlSH