Disable player marker animations at high player counts

This commit is contained in:
James Lyne 2021-01-05 23:54:50 +00:00
parent 3573694df0
commit 76c5892c66
2 changed files with 11 additions and 3 deletions

View File

@ -20,7 +20,7 @@
<script lang="ts">
import PlayerMarker from "@/components/map/marker/PlayerMarker.vue";
import {defineComponent, computed} from "@vue/runtime-core";
import {defineComponent, computed, watch} from "@vue/runtime-core";
import {useStore} from "@/store";
import {LayerGroup} from 'leaflet';
import DynmapMap from "@/leaflet/DynmapMap";
@ -38,15 +38,17 @@ export default defineComponent({
},
setup(props) {
props.leaflet.createPane('players');
const store = useStore(),
playerPane = props.leaflet.createPane('players'),
players = computed(() => store.state.players),
playerCount = computed(() => store.state.players.size),
componentSettings = store.state.components.playerMarkers,
layerGroup = new LayerGroup([],{
pane: 'players'
});
watch(playerCount, (newValue) => playerPane.classList.toggle('no-animations', newValue > 150))
return {
players,
componentSettings,

View File

@ -327,6 +327,12 @@ button {
display: block;
outline: auto;
}
@at-root {
.no-animations .marker.marker--player {
transition: none;
}
}
}
/*******************