| | |
| | | class="information" |
| | | v-for="(item, index) in SearchArr" |
| | | :key="index" |
| | | style="cursor: pointer;" |
| | | style="cursor: pointer" |
| | | @click="showCard(item)" |
| | | > |
| | | <li style="font-size: 0.18rem; font-weight: 700"> |
| | |
| | | 姓名: |
| | | {{ currentMark[0].name ? currentMark[0].name : "-" }} |
| | | </li> |
| | | <li>别名: {{ currentMark[0].nikeName ? currentMark[0].nikeName : "-" }}</li> |
| | | <li>籍贯: {{ currentMark[0].nativePlace ? currentMark[0].nativePlace : "-" }}</li> |
| | | <li>医学分科: {{ currentMark[0].barnch ? currentMark[0].barnch : "-" }}</li> |
| | | <li> |
| | | 别名: |
| | | {{ currentMark[0].nikeName ? currentMark[0].nikeName : "-" }} |
| | | </li> |
| | | <li> |
| | | 籍贯: |
| | | {{ |
| | | currentMark[0].nativePlace |
| | | ? currentMark[0].nativePlace |
| | | : "-" |
| | | }} |
| | | </li> |
| | | <li> |
| | | 医学分科: |
| | | {{ currentMark[0].barnch ? currentMark[0].barnch : "-" }} |
| | | </li> |
| | | <li |
| | | class="medicalLi" |
| | | :title="currentMark[0].medical ? currentMark[0].medical : '-'" |
| | | > |
| | | 小传: {{ currentMark[0].medical ? currentMark[0].medical : "-" }} |
| | | 小传: |
| | | {{ currentMark[0].medical ? currentMark[0].medical : "-" }} |
| | | </li> |
| | | </ul> |
| | | <el-button |
| | |
| | | <el-collapse-item |
| | | v-for="(item, index) in currentMark" |
| | | :name="index" |
| | | :key="index" |
| | | > |
| | | <template slot="title"> |
| | | <div class="titleImg"> |
| | |
| | | > |
| | | </el-collapse-item> |
| | | </el-collapse> |
| | | |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | " |
| | | :style="{ |
| | | marginRight: index === dynasty1.length - 1 ? '0' : '0.03rem', |
| | | background: dynasty1Color == item.id ? '#244A7B' : '#597AA5' |
| | | background: dynasty1Color == item.id ? '#244A7B' : '#597AA5', |
| | | }" |
| | | > |
| | | {{ item.dynastyChs }} |
| | |
| | | <!-- <script src="https://api.map.baidu.com/api?v=3.0&ak=5USVDAhhS4ssz44HLq3gNPZai7naXf4Q&callback=initializeMap"></script> --> |
| | | <!-- 5USVDAhhS4ssz44HLq3gNPZai7naXf4Q --> |
| | | <script> |
| | | import { loadBMap } from "@/static/map.js"; |
| | | import L from "leaflet"; |
| | | import "leaflet.chinatmsproviders"; |
| | | import * as echarts from "echarts"; |
| | | import "echarts/extension/bmap/bmap"; |
| | | import { |
| | | getRetrieval, |
| | | getDynasty, |
| | | getPreCount, |
| | | getDynastyData |
| | | getDynastyData, |
| | | } from "@/api/index.js"; |
| | | |
| | | export default { |
| | |
| | | information: [ |
| | | { |
| | | label: "姓名", |
| | | content: "李时珍" |
| | | content: "李时珍", |
| | | }, |
| | | { |
| | | label: "别名", |
| | | content: "东丽先生" |
| | | content: "东丽先生", |
| | | }, |
| | | { |
| | | label: "籍贯", |
| | | content: "湖北" |
| | | content: "湖北", |
| | | }, |
| | | { |
| | | label: "医学分科", |
| | | content: "中药,针灸" |
| | | content: "中药,针灸", |
| | | }, |
| | | { |
| | | label: "小传", |
| | | content: |
| | | "李时珍(约1518年~1593 年), 字东璧, 晚年自号濒湖山人, 湖广黄州府薪州(今湖北省薪春县) 人, 明代著名医药学家。 与“ 医圣” 万密斋齐名, 古有“ 万密斋的方, 李时珍的药” 之说。 后为楚干府..." |
| | | } |
| | | "李时珍(约1518年~1593 年), 字东璧, 晚年自号濒湖山人, 湖广黄州府薪州(今湖北省薪春县) 人, 明代著名医药学家。 与“ 医圣” 万密斋齐名, 古有“ 万密斋的方, 李时珍的药” 之说。 后为楚干府...", |
| | | }, |
| | | ], |
| | | // 下面的朝代1 |
| | | dynasty1Color: "", |
| | |
| | | { |
| | | name: "夏朝", |
| | | coord: "2070BC", |
| | | id: 1 |
| | | id: 1, |
| | | }, |
| | | { |
| | | name: "商朝", |
| | | id: 2, |
| | | coord: "1600BC" |
| | | coord: "1600BC", |
| | | }, |
| | | { |
| | | name: "西周", |
| | | id: 3, |
| | | coord: "1600BC" |
| | | coord: "1600BC", |
| | | }, |
| | | { |
| | | name: "春秋战国", |
| | | id: 4, |
| | | coord: "770BC" |
| | | coord: "770BC", |
| | | }, |
| | | { |
| | | name: "秦朝", |
| | | id: 5, |
| | | coord: "221BC" |
| | | coord: "221BC", |
| | | }, |
| | | { |
| | | name: "汉朝", |
| | | id: 6, |
| | | coord: "202BC" |
| | | coord: "202BC", |
| | | }, |
| | | { |
| | | name: "三国两晋南北朝", |
| | | id: 7, |
| | | coord: "184" |
| | | coord: "184", |
| | | }, |
| | | { |
| | | name: "隋朝", |
| | | id: 8, |
| | | coord: "581" |
| | | coord: "581", |
| | | }, |
| | | { |
| | | name: "唐朝", |
| | | id: 9, |
| | | coord: "618" |
| | | coord: "618", |
| | | }, |
| | | { |
| | | name: "五代十国", |
| | | id: 10, |
| | | coord: "907" |
| | | coord: "907", |
| | | }, |
| | | { |
| | | name: "辽夏金", |
| | | id: 11, |
| | | coord: "907" |
| | | coord: "907", |
| | | }, |
| | | { |
| | | name: "宋朝", |
| | | id: 12, |
| | | coord: "960" |
| | | coord: "960", |
| | | }, |
| | | { |
| | | name: "元朝", |
| | | id: 13, |
| | | coord: "1271" |
| | | coord: "1271", |
| | | }, |
| | | { |
| | | name: "明朝", |
| | | id: 14, |
| | | coord: "1368" |
| | | coord: "1368", |
| | | }, |
| | | { |
| | | name: "清朝", |
| | | id: 15, |
| | | coord: "1636" |
| | | } |
| | | coord: "1636", |
| | | }, |
| | | ], |
| | | // 标题顶部栏需要的东西 |
| | | idIndex: 0, |
| | |
| | | { |
| | | name: "夏", |
| | | color: "#90BBD8", |
| | | id: 1 |
| | | id: 1, |
| | | }, |
| | | { |
| | | name: "商", |
| | | color: "#EDD28B", |
| | | id: 2 |
| | | id: 2, |
| | | }, |
| | | { |
| | | name: "西周", |
| | | color: "#CF746D", |
| | | id: 3 |
| | | id: 3, |
| | | }, |
| | | { |
| | | name: "秦", |
| | | color: "#9CC27A", |
| | | id: 4 |
| | | id: 4, |
| | | }, |
| | | { |
| | | name: "汉", |
| | | color: "#5B6CB9", |
| | | id: 5 |
| | | id: 5, |
| | | }, |
| | | { |
| | | name: "隋", |
| | | color: "#8860A8", |
| | | id: 6 |
| | | id: 6, |
| | | }, |
| | | { |
| | | name: "唐", |
| | | color: "#DE8E66", |
| | | id: 7 |
| | | id: 7, |
| | | }, |
| | | { |
| | | name: "明", |
| | | color: "#DE8E66", |
| | | id: 8 |
| | | } |
| | | id: 8, |
| | | }, |
| | | ], |
| | | // 搜索后是否显示弹框 |
| | | isSearch: false, |
| | |
| | | id: 1, |
| | | name: "李时珍", |
| | | birthAndDeath: "1518-1593", |
| | | source: "国图规范档,CBDB,上图古籍数据库 籍贯:湖北" |
| | | source: "国图规范档,CBDB,上图古籍数据库 籍贯:湖北", |
| | | }, |
| | | { |
| | | id: 2, |
| | | name: "李时珍", |
| | | birthAndDeath: "1518-1593", |
| | | source: "国图规范档,CBDB,上图古籍数据库 籍贯:湖北" |
| | | } |
| | | source: "国图规范档,CBDB,上图古籍数据库 籍贯:湖北", |
| | | }, |
| | | ], |
| | | zoomLevel: 5, |
| | | oldMarkList: [], |
| | | aggregatedData: [], |
| | | openData: null |
| | | openData: null, |
| | | }; |
| | | }, |
| | | onLoad(options) { |
| | |
| | | }, |
| | | mounted() { |
| | | this.getDynastyList(); |
| | | |
| | | this.getDataList(); |
| | | this.getHaveDataDynasty(); |
| | | }, |
| | |
| | | let times = 0; |
| | | getPreCount({ |
| | | keyword: this.keyword, |
| | | dynasty: this.dynasty1Color |
| | | dynasty: this.dynasty1Color, |
| | | }).then(async (res) => { |
| | | const totalCount = res.object; |
| | | if (totalCount % 200 == 0) { |
| | |
| | | name: item?.NAME[0]?.content1, |
| | | source: "-", |
| | | nativPlace: item?.NATIVE_PLACE[0].content1, |
| | | id: item.id |
| | | id: item.id, |
| | | })); |
| | | this.loading = false; |
| | | this.markerList = markerList; |
| | |
| | | keyword: this.keyword, |
| | | dynasty: this.dynasty1Color, |
| | | page: count, |
| | | pageSize: 200 |
| | | pageSize: 200, |
| | | }); |
| | | if (res.object) { |
| | | let markerList = []; |
| | |
| | | } |
| | | var map = L.map("map", { |
| | | preferCanvas: true, |
| | | attributionControl: false |
| | | attributionControl: false, |
| | | }).setView([34.3227, 108.5525], this.zoomLevel); |
| | | map.on("moveend", this.onMapMoveEnd); |
| | | map.on("zoomend", () => { |
| | |
| | | .chinaProvider("TianDiTu.Normal.Map", { |
| | | key: "76bc34ead7e30e663a4eded8aeaf5860", |
| | | maxZoom: 18, |
| | | minZoom: 3 |
| | | minZoom: 3, |
| | | }) |
| | | .addTo(map); |
| | | L.tileLayer |
| | | .chinaProvider("TianDiTu.Normal.Annotion", { |
| | | key: "76bc34ead7e30e663a4eded8aeaf5860", |
| | | maxZoom: 18, |
| | | minZoom: 3 |
| | | minZoom: 3, |
| | | }) |
| | | .addTo(map); |
| | | this.map = map; |
| | |
| | | 17: 4513.997733376551, |
| | | 18: 2256.9988666882755, |
| | | 19: 1128.4994333441377, |
| | | 20: 564.24971667206887 |
| | | 20: 564.24971667206887, |
| | | }; |
| | | // 根据比例尺计算当前地图1厘米的经纬度差值 |
| | | const cmData = scale[this.zoomLevel] / 100; // 将厘米转换为米 |
| | |
| | | contentY: "", |
| | | xList: [], |
| | | yList: [], |
| | | data: [] |
| | | data: [], |
| | | }; |
| | | obj.xList.push(item.xCoord); |
| | | obj.yList.push(item.yCoord); |
| | |
| | | : "99+" |
| | | }</div>`, |
| | | iconSize: [30, 30], |
| | | className: "map-circle" |
| | | className: "map-circle", |
| | | }); |
| | | const temp_mark = L.marker( |
| | | [aggregatedItem.contentY, aggregatedItem.contentX], |
| | | { |
| | | icon: icon |
| | | icon: icon, |
| | | } |
| | | ); |
| | | this.oldMarkList.push(temp_mark); |
| | |
| | | nativePlace: item?.content1, |
| | | barnch: item?.MEDICAL_BRANCH[0]?.content1, |
| | | medical: item?.BIOGRAPHY, |
| | | id: item.id |
| | | id: item.id, |
| | | }; |
| | | }); |
| | | this.isTop = e.containerPoint.y - 435 + "px"; |
| | |
| | | nativePlace: item?.content1, |
| | | barnch: item?.MEDICAL_BRANCH[0]?.content1, |
| | | medical: item?.BIOGRAPHY, |
| | | id: item.id |
| | | id: item.id, |
| | | }; |
| | | }); |
| | | this.isEchTrue = true; |
| | |
| | | // 查看更多>> |
| | | viewMoreClick(data) { |
| | | uni.navigateTo({ |
| | | url: "/pages/character/detail?id=" + data.id |
| | | url: "/pages/character/detail?id=" + data.id, |
| | | }); |
| | | } |
| | | } |
| | | }, |
| | | }, |
| | | }; |
| | | </script> |
| | | |