4 ヶ月前 · 6e0b313649
--- a/.gitignore
+++ b/.gitignore
@@ -0,0 +1,30 @@
 
				+# Logs
			
 
				+logs
			
 
				+*.log
			
 
				+npm-debug.log*
			
 
				+yarn-debug.log*
			
 
				+yarn-error.log*
			
 
				+pnpm-debug.log*
			
 
				+lerna-debug.log*
			
 
				+
			
 
				+node_modules
			
 
				+.DS_Store
			
 
				+dist
			
 
				+dist-ssr
			
 
				+coverage
			
 
				+*.local
			
 
				+
			
 
				+/cypress/videos/
			
 
				+/cypress/screenshots/
			
 
				+
			
 
				+# Editor directories and files
			
 
				+.vscode/*
			
 
				+!.vscode/extensions.json
			
 
				+.idea
			
 
				+*.suo
			
 
				+*.ntvs*
			
 
				+*.njsproj
			
 
				+*.sln
			
 
				+*.sw?
			
 
				+
			
 
				+*.tsbuildinfo
			
--- a/.vscode/extensions.json
+++ b/.vscode/extensions.json
@@ -0,0 +1,3 @@
 
				+{
			
 
				+  "recommendations": ["Vue.volar"]
			
 
				+}
			
--- a/README.md
+++ b/README.md
@@ -0,0 +1 @@
 
				+ZHS2504131-1	湖南自然资源厅-文旅数字化合作项目
			
--- a/index.html
+++ b/index.html
@@ -0,0 +1,13 @@
 
				+<!DOCTYPE html>
			
 
				+<html lang="">
			
 
				+  <head>
			
 
				+    <meta charset="UTF-8">
			
 
				+    <link rel="icon" href="/favicon.ico">
			
 
				+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
			
 
				+    <title>云上岳阳</title>
			
 
				+  </head>
			
 
				+  <body>
			
 
				+    <div id="app"></div>
			
 
				+    <script type="module" src="/src/main.js"></script>
			
 
				+  </body>
			
 
				+</html>
			
--- a/jsconfig.json
+++ b/jsconfig.json
@@ -0,0 +1,8 @@
 
				+{
			
 
				+  "compilerOptions": {
			
 
				+    "paths": {
			
 
				+      "@/*": ["./src/*"]
			
 
				+    }
			
 
				+  },
			
 
				+  "exclude": ["node_modules", "dist"]
			
 
				+}
			
--- a/package.json
+++ b/package.json
@@ -0,0 +1,25 @@
 
				+{
			
 
				+  "name": "yueyang-map-h5",
			
 
				+  "version": "0.0.0",
			
 
				+  "private": true,
			
 
				+  "type": "module",
			
 
				+  "scripts": {
			
 
				+    "dev": "vite",
			
 
				+    "build": "vite build",
			
 
				+    "preview": "vite preview"
			
 
				+  },
			
 
				+  "dependencies": {
			
 
				+    "@amap/amap-jsapi-loader": "^1.0.1",
			
 
				+    "pinia": "^3.0.1",
			
 
				+    "vue": "^3.5.13",
			
 
				+    "vue-router": "^4.5.0"
			
 
				+  },
			
 
				+  "devDependencies": {
			
 
				+    "@vitejs/plugin-vue": "^5.2.3",
			
 
				+    "autoprefixer": "^10.4.21",
			
 
				+    "postcss-px-to-viewport": "^1.1.1",
			
 
				+    "sass": "^1.86.3",
			
 
				+    "vite": "^6.2.4",
			
 
				+    "vite-plugin-vue-devtools": "^7.7.2"
			
 
				+  }
			
 
				+}
			
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
--- a/postcss.config.js
+++ b/postcss.config.js
@@ -0,0 +1,22 @@
 
				+export default {

			
 
				+  plugins: {

			
 
				+    autoprefixer: {},

			
 
				+    "postcss-px-to-viewport": {

			
 
				+      unitToConvert: "px", // 需要转换的单位，默认为"px"

			
 
				+      viewportWidth: 750, // 设计稿的视口宽度

			
 
				+      unitPrecision: 5, // 单位转换后保留的精度

			
 
				+      propList: ["*"], // 能转化为vw的属性列表

			
 
				+      viewportUnit: "vw", // 希望使用的视口单位

			
 
				+      fontViewportUnit: "vw", // 字体使用的视口单位

			
 
				+      selectorBlackList: [], // 需要忽略的CSS选择器，不会转为视口单位，使用原有的px等单位。

			
 
				+      minPixelValue: 1, // 设置最小的转换数值，如果为1的话，只有大于1的值会被转换

			
 
				+      mediaQuery: true, // 媒体查询里的单位是否需要转换单位

			
 
				+      replace: true, //  是否直接更换属性值，而不添加备用属性

			
 
				+      exclude: /node_modules/i, // 忽略某些文件夹下的文件或特定文件，例如 'node_modules' 下的文件

			
 
				+      include: undefined, // 如果设置了include，那将只有匹配到的文件才会被转换

			
 
				+      landscape: false, // 是否添加根据 landscapeWidth 生成的媒体查询条件 @media (orientation: landscape)

			
 
				+      landscapeUnit: "vw", // 横屏时使用的单位

			
 
				+      landscapeWidth: 750, // 横屏时使用的视口宽度

			
 
				+    },

			
 
				+  },

			
 
				+};

			
--- a/public/favicon.ico
+++ b/public/favicon.ico
--- a/src/App.vue
+++ b/src/App.vue
@@ -0,0 +1,9 @@
 
				+<script setup>
			
 
				+import { RouterView } from "vue-router";
			
 
				+</script>
			
 
				+
			
 
				+<template>
			
 
				+  <RouterView />
			
 
				+</template>
			
 
				+
			
 
				+<style scoped></style>
			
--- a/src/assets/fonts/SOURCEHANSERIFCN-BOLD.OTF
+++ b/src/assets/fonts/SOURCEHANSERIFCN-BOLD.OTF
--- a/src/assets/fonts/SOURCEHANSERIFCN-REGULAR.OTF
+++ b/src/assets/fonts/SOURCEHANSERIFCN-REGULAR.OTF
--- a/src/assets/main.css
+++ b/src/assets/main.css
@@ -0,0 +1,112 @@
 
				+:root {
			
 
				+  --z-index-normal: 1;
			
 
				+  --z-index-top: 1000;
			
 
				+  --z-index-popper: 2000;
			
 
				+  --z-hot-popper: 3000;
			
 
				+}
			
 
				+
			
 
				+body,
			
 
				+ol,
			
 
				+ul,
			
 
				+h1,
			
 
				+h2,
			
 
				+h3,
			
 
				+h4,
			
 
				+h5,
			
 
				+h6,
			
 
				+p,
			
 
				+th,
			
 
				+td,
			
 
				+dl,
			
 
				+dd,
			
 
				+form,
			
 
				+fieldset,
			
 
				+legend,
			
 
				+input,
			
 
				+textarea,
			
 
				+select {
			
 
				+  margin: 0;
			
 
				+  padding: 0;
			
 
				+}
			
 
				+* {
			
 
				+  box-sizing: border-box;
			
 
				+  user-select: none;
			
 
				+}
			
 
				+body {
			
 
				+  color: #333333;
			
 
				+  text-align: justify;
			
 
				+  font-family: "SourceHanSerifSC-Regular";
			
 
				+  -webkit-tap-highlight-color: transparent;
			
 
				+}
			
 
				+a {
			
 
				+  color: #fff;
			
 
				+  cursor: pointer;
			
 
				+  text-decoration: none;
			
 
				+}
			
 
				+em {
			
 
				+  font-style: normal;
			
 
				+}
			
 
				+li {
			
 
				+  list-style: none;
			
 
				+}
			
 
				+img {
			
 
				+  border: 0;
			
 
				+  vertical-align: middle;
			
 
				+}
			
 
				+table {
			
 
				+  border-collapse: collapse;
			
 
				+  border-spacing: 0;
			
 
				+}
			
 
				+p {
			
 
				+  word-wrap: break-word;
			
 
				+}
			
 
				+iframe {
			
 
				+  border: none;
			
 
				+}
			
 
				+
			
 
				+@font-face {
			
 
				+  font-family: "SourceHanSerifSC-Bold";
			
 
				+  src: url("./fonts/SOURCEHANSERIFCN-BOLD.otf");
			
 
				+}
			
 
				+@font-face {
			
 
				+  font-family: "SourceHanSerifSC-Regular";
			
 
				+  src: url("./fonts/SOURCEHANSERIFCN-REGULAR.otf");
			
 
				+}
			
 
				+
			
 
				+.limit-line {
			
 
				+  display: -webkit-box;
			
 
				+  overflow: hidden;
			
 
				+  text-overflow: ellipsis;
			
 
				+  -webkit-line-clamp: 1;
			
 
				+  -webkit-box-orient: vertical;
			
 
				+  word-break: break-all;
			
 
				+  word-wrap: break-word;
			
 
				+}
			
 
				+
			
 
				+.line-2 {
			
 
				+  -webkit-line-clamp: 2;
			
 
				+}
			
 
				+
			
 
				+.line-3 {
			
 
				+  -webkit-line-clamp: 3;
			
 
				+}
			
 
				+
			
 
				+.hidden {
			
 
				+  display: none !important;
			
 
				+  visibility: hidden !important;
			
 
				+}
			
 
				+
			
 
				+.darkGlass {
			
 
				+  background-color: rgba(0, 0, 0, 0.5);
			
 
				+}
			
 
				+
			
 
				+.message-outer {
			
 
				+  position: absolute;
			
 
				+  display: table;
			
 
				+  height: 100%;
			
 
				+  width: 100%;
			
 
				+
			
 
				+  * {
			
 
				+    transition: all 0.3s;
			
 
				+  }
			
 
				+}
			
--- a/src/main.js
+++ b/src/main.js
@@ -0,0 +1,14 @@
 
				+import './assets/main.css'
			
 
				+
			
 
				+import { createApp } from 'vue'
			
 
				+import { createPinia } from 'pinia'
			
 
				+
			
 
				+import App from './App.vue'
			
 
				+import router from './router'
			
 
				+
			
 
				+const app = createApp(App)
			
 
				+
			
 
				+app.use(createPinia())
			
 
				+app.use(router)
			
 
				+
			
 
				+app.mount('#app')
			
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -0,0 +1,19 @@
 
				+import { createRouter, createWebHistory } from "vue-router";
			
 
				+
			
 
				+const router = createRouter({
			
 
				+  history: createWebHistory(import.meta.env.BASE_URL),
			
 
				+  routes: [
			
 
				+    {
			
 
				+      path: "/",
			
 
				+      name: "home",
			
 
				+      component: () => import("../views/home/index.vue"),
			
 
				+    },
			
 
				+    {
			
 
				+      path: "/map",
			
 
				+      name: "map",
			
 
				+      component: () => import("../views/map/index.vue"),
			
 
				+    },
			
 
				+  ],
			
 
				+});
			
 
				+
			
 
				+export default router;
			
--- a/src/stores/counter.js
+++ b/src/stores/counter.js
@@ -0,0 +1,12 @@
 
				+import { ref, computed } from 'vue'
			
 
				+import { defineStore } from 'pinia'
			
 
				+
			
 
				+export const useCounterStore = defineStore('counter', () => {
			
 
				+  const count = ref(0)
			
 
				+  const doubleCount = computed(() => count.value * 2)
			
 
				+  function increment() {
			
 
				+    count.value++
			
 
				+  }
			
 
				+
			
 
				+  return { count, doubleCount, increment }
			
 
				+})
			
--- a/src/views/home/index.vue
+++ b/src/views/home/index.vue
@@ -0,0 +1,3 @@
 
				+<template>

			
 
				+  <div class="home">1</div>

			
 
				+</template>

			
--- a/src/views/map/index.vue
+++ b/src/views/map/index.vue
@@ -0,0 +1,68 @@
 
				+<template>

			
 
				+  <div class="map">

			
 
				+    <div id="amap" />

			
 
				+  </div>

			
 
				+</template>

			
 
				+

			
 
				+<script setup>

			
 
				+import { onMounted } from "vue";

			
 
				+import AMapLoader from "@amap/amap-jsapi-loader";

			
 
				+

			
 
				+let AMap = null;

			
 
				+let map = null;

			
 
				+let imageLayer = null;

			
 
				+

			
 
				+const initMap = async () => {

			
 
				+  const _AMap = await AMapLoader.load({

			
 
				+    key: "3283c863f6f35814f1a6219cdd69cb6e",

			
 
				+    version: "2.0",

			
 
				+    plugins: ["AMap.MoveAnimation", "AMap.ImageLayer", "AMap.TileLayer"],

			
 
				+  });

			
 
				+  AMap = _AMap;

			
 
				+

			
 
				+  addImageLayer();

			
 
				+  const layer = new AMap.createDefaultLayer({

			
 
				+    visible: true, // 是否可见

			
 
				+    opacity: 1, // 透明度

			
 
				+    zIndex: 0, // 叠加层级

			
 
				+  });

			
 
				+

			
 
				+  map = new AMap.Map("amap", {

			
 
				+    viewMode: "2D",

			
 
				+    zoom: 14, // 地图显示的缩放级别

			
 
				+    zooms: [10, 18],

			
 
				+    center: [106.837106, 29.712762],

			
 
				+    resizeEnable: true, // 是否监控地图容器尺寸变化

			
 
				+    layers: [layer, imageLayer],

			
 
				+  });

			
 
				+

			
 
				+  map.on("zoomchange", () => {

			
 
				+    console.log("当前缩放级别:", map.getZoom());

			
 
				+  });

			
 
				+};

			
 
				+

			
 
				+const addImageLayer = () => {

			
 
				+  imageLayer = new AMap.ImageLayer({

			
 
				+    bounds: new AMap.Bounds(

			
 
				+      [106.837106, 29.712762], // 左下  手绘图左下相对于地图的经纬度

			
 
				+      [106.848727, 29.720554] // 右上  手绘图右上相对于地图的经纬度

			
 
				+    ),

			
 
				+    // url为手绘图地址

			
 
				+    url: "https://amappc.cn-hangzhou.oss-pub.aliyun-inc.com/lbs/static/img/dongwuyuan.jpg",

			
 
				+    zIndex: 100,

			
 
				+    zooms: [14, 20], // 设置可见级别，[最小级别，最大级别]

			
 
				+  });

			
 
				+};

			
 
				+

			
 
				+onMounted(() => {

			
 
				+  initMap();

			
 
				+});

			
 
				+</script>

			
 
				+

			
 
				+<style lang="scss" scoped>

			
 
				+.map {

			
 
				+  #amap {

			
 
				+    height: 100vh;

			
 
				+  }

			
 
				+}

			
 
				+</style>

			
--- a/vite.config.js
+++ b/vite.config.js
@@ -0,0 +1,21 @@
 
				+import { fileURLToPath, URL } from "node:url";
			
 
				+
			
 
				+import { defineConfig } from "vite";
			
 
				+import vue from "@vitejs/plugin-vue";
			
 
				+// import vueDevTools from 'vite-plugin-vue-devtools'
			
 
				+
			
 
				+// https://vite.dev/config/
			
 
				+export default defineConfig({
			
 
				+  plugins: [
			
 
				+    vue(),
			
 
				+    // vueDevTools(),
			
 
				+  ],
			
 
				+  server: {
			
 
				+    host: "0.0.0.0",
			
 
				+  },
			
 
				+  resolve: {
			
 
				+    alias: {
			
 
				+      "@": fileURLToPath(new URL("./src", import.meta.url)),
			
 
				+    },
			
 
				+  },
			
 
				+});
		`@@ -0,0 +1 @@`
		`+ZHS2504131-1 湖南自然资源厅-文旅数字化合作项目`