原神地图v3 (yuanshenmap-v3)

yarn
# or
npm install

quasar dev

quasar build

Router.beforeEach((to, from, next) => {
    //鉴定是否存在token，若否，默认以游客身份登录
    if (get_user_token() == null) {
      quest_request().then(res => {
        set_user_token(res.data.access_token, res.data.expires_in)
        next();
      })
    }
    else {
      next();
    }
  })

<!-- id为map的div为容器，其余两个为地图的背景蒙层 -->
<div class="map_containor">
    <div class="stars"></div>
    <div class="twinkling"></div>
    <div id="map"></div>
</div>

import { init_map } from "../api/map";
......
mounted() {
    //生成地图
    this.map = init_map();
  },

@import url("https://yuanshen.site/css/background.css");/* 地图蒙层样式 */

#map {
    width: 100vw;
    height: 100vh;
    background: transparent;
    z-index: 1000;
    background: radial-gradient(transparent 70%, rgba(0, 0, 0, 0.5));
}