|
|
@@ -0,0 +1,846 @@
|
|
|
+// pages/index/jingdianchaxun/jingdianchaxun.js
|
|
|
+const app = getApp()
|
|
|
+Page({
|
|
|
+ data: {
|
|
|
+ layoutType: 'default',
|
|
|
+ layoutConfig: {},
|
|
|
+ featureLayout: [],
|
|
|
+ latitude: 36.5,
|
|
|
+ longitude: 118.0,
|
|
|
+ scale: 7,
|
|
|
+ showImageModal: false,
|
|
|
+ currentMarker: null,
|
|
|
+ showWebView: false,
|
|
|
+ webViewUrl: "",
|
|
|
+ currentVrTitle: "",
|
|
|
+ searchText: "",
|
|
|
+ // 新增控制变量
|
|
|
+ showSearchMarkers: false,
|
|
|
+ searchMarkers: [] , // 新增绿色搜索标记
|
|
|
+
|
|
|
+ markers: [
|
|
|
+ {
|
|
|
+ id: 1,
|
|
|
+ latitude: 36.665282,
|
|
|
+ longitude: 117.119999,
|
|
|
+ width: 30, // 添加宽度
|
|
|
+ height: 30, // 添加高度
|
|
|
+ title: '济南战役纪念馆',
|
|
|
+ address: '市中区英雄山路18号',
|
|
|
+ iconPath: '/images/red-marker.png',
|
|
|
+ callout: {
|
|
|
+ content: '济南战役纪念馆\n华东地区规模最大的革命烈士纪念地',
|
|
|
+ color: '#000',
|
|
|
+ fontSize: 14,
|
|
|
+ borderRadius: 5,
|
|
|
+ bgColor: '#fff',
|
|
|
+ padding: 5,
|
|
|
+ display: 'ALWAYS'
|
|
|
+ },
|
|
|
+ imageUrl: 'https://smp.ouc.edu.cn/_upload/article/images/f5/0d/85b29d70430a9261ef3830f24970/959ccc6d-b829-4d3f-8335-2c776c9faca7.png',
|
|
|
+ description: '济南革命烈士陵园，坐落在泉城济南英雄山风景区，占地480亩，于1949年建成。陵园分为革命烈士纪念塔、济南战役纪念馆、革命烈士墓区、"胜利"铜雕、毛泽东主席凭吊革命烈士纪念亭和济南革命烈士纪念群雕等纪念建筑物。陵园以济南战役纪念馆为中心，形成了辐射全市范围的红色旅游景区。是山东省规模最大的烈士陵园，1977年被公布为山东省第一批重点文物保护单位。',
|
|
|
+ detail: [
|
|
|
+ { label: '开放时间', value: '9：00-16：00（周一闭馆，周二至周日开馆）' },
|
|
|
+ { label: '门票', value: '免费' }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 2,
|
|
|
+ latitude: 36.090839,
|
|
|
+ longitude: 120.384428,
|
|
|
+ title: '青岛革命烈士纪念馆',
|
|
|
+ address: '市南区芝泉路6号',
|
|
|
+ width: 30, // 添加宽度
|
|
|
+ height: 30, // 添加高度
|
|
|
+ iconPath: '/images/red-marker.png',
|
|
|
+ callout: {
|
|
|
+ content: '青岛革命烈士纪念馆\n山东省重点文物保护单位',
|
|
|
+ color: '#000',
|
|
|
+ fontSize: 14,
|
|
|
+ borderRadius: 5,
|
|
|
+ bgColor: '#fff',
|
|
|
+ padding: 5,
|
|
|
+ display: 'ALWAYS'
|
|
|
+ },
|
|
|
+ imageUrl: 'https://bkimg.cdn.bcebos.com/pic/730e0cf3d7ca7bcb0a463bb5de507c63f6246a6002ad?x-bce-process=image/format,f_auto/quality,Q_70/resize,m_lfit,limit_1,w_536',
|
|
|
+ description: '青岛市革命烈士纪念馆(青岛市烈士纪念设施保护中心)位于市南区芝泉路6号，建立于1977年，1981年6月对外开放，占地面积35512平方米，总建筑面积4050平方米。主要纪念设施有烈士纪念堂、抗战馆、军魂馆、"山河魂"烈士群雕、烈士英名碑、流芳亭等。主要承担烈士纪念活动、烈士纪念设施保护及宣教褒扬等工作。被评为国家级烈士纪念设施，国家、省、市爱国主义教育基地，山东省党史教育基地，山东省国防教育基地，山东省党员教育基地，山东省退役军人思想政治教育基地等。',
|
|
|
+ detail: [
|
|
|
+ { label: '开放时间', value: '9：00-16：30（周一闭馆）' },
|
|
|
+ { label: '门票', value: '免费' }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 3,
|
|
|
+ latitude: 36.804685,
|
|
|
+ longitude: 118.055008,
|
|
|
+ title: '黑铁山抗日武装起义纪念馆',
|
|
|
+ address: '张店区四宝山街道',
|
|
|
+ width: 30, // 添加宽度
|
|
|
+ height: 30, // 添加高度
|
|
|
+ iconPath: '/images/red-marker.png',
|
|
|
+ callout: {
|
|
|
+ content: '黑铁山起义纪念地\n山东抗日三大起义之一',
|
|
|
+ color: '#000',
|
|
|
+ fontSize: 14,
|
|
|
+ borderRadius: 5,
|
|
|
+ bgColor: '#fff',
|
|
|
+ padding: 5,
|
|
|
+ display: 'ALWAYS'
|
|
|
+ },
|
|
|
+ imageUrl: 'https://bkimg.cdn.bcebos.com/pic/d8f9d72a6059252dd42a4051e4c8143b5bb5c9ea1310?x-bce-process=image/format,f_auto/watermark,image_d2F0ZXIvYmFpa2UyNzI,g_7,xp_5,yp_5,P_20/resize,m_lfit,limit_1,h_1080',
|
|
|
+ description: '黑铁山抗日武装起义纪念馆于1995年纪念抗日战争胜利50周年之际奠基，于1996年8月1日落成开馆。由张店区委区政府发出倡议，号召张店区党政机关、人民大众捐资160万元而兴建。主体为二层楼，建筑面积1300平方米。为淄博市市级重点烈士纪念建筑物保护单位、山东省爱国主义教育基地。',
|
|
|
+ detail: [
|
|
|
+ { label: '开放时间', value: '上午8:30-11:30 下午13:30-17:00（周一闭馆）' },
|
|
|
+ { label: '门票', value: '具体收费情况以现场公示为主' }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 4,
|
|
|
+ latitude: 34.810488,
|
|
|
+ longitude: 117.323725,
|
|
|
+ title: '台儿庄大战纪念馆',
|
|
|
+ width: 30, // 添加宽度
|
|
|
+ height: 30, // 添加高度
|
|
|
+ address: '台儿庄区沿河南路6号',
|
|
|
+ iconPath: '/images/red-marker.png',
|
|
|
+ callout: {
|
|
|
+ content: '台儿庄大战纪念馆\n抗日战争正面战场首次重大胜利',
|
|
|
+ color: '#000',
|
|
|
+ fontSize: 14,
|
|
|
+ borderRadius: 5,
|
|
|
+ bgColor: '#fff',
|
|
|
+ padding: 5,
|
|
|
+ display: 'ALWAYS'
|
|
|
+ },
|
|
|
+ imageUrl: 'https://bkimg.cdn.bcebos.com/pic/58ee3d6d55fbb2fbee8d1683414a20a44723dcf9?x-bce-process=image/format,f_auto/watermark,image_d2F0ZXIvYmFpa2UyNzI,g_7,xp_5,yp_5,P_20/resize,m_lfit,limit_1,h_1080',
|
|
|
+ description: '台儿庄大战纪念馆，位于山东省枣庄市台儿庄区城区西南郊，是为了纪念抗日战争初期著名的台儿庄战役而修建，于1992年由台儿庄区人民政府筹资建成，1993年4月8日正式对外开放，后经扩建，占地面积达96亩，建筑面积1.2万平方米。台儿庄大战纪念馆由纪念碑、陈列馆、影视馆、全景画馆、战地记者馆、无名英雄墓、国防教育园等部分组成，并设有临时展厅、多功能报告厅和红色图书室。展出文物、图片和史料2000余件，通过历史文物、历史图片、文献资料与各类辅助陈列手段的有机结合，全景再现台儿庄大战中爱国将士报效祖国的壮举。截至2022年底，馆有藏品数量6598件/套，年度观众总数为155323人。台儿庄大战纪念馆是全国百家爱国主义教育示范基地、全国中小学爱国主义教育基地、中国侨联爱国主义教育基地、国家首批国防教育示范基地、国家AAAA级旅游景区，并曾多年获评"山东省文明单位"。2014年8月24日，台儿庄大战纪念馆被列入《第一批国家级抗战纪念设施、遗址名录》。',
|
|
|
+ detail: [
|
|
|
+ { label: '开放时间', value: '8:00-17:00（全年）' },
|
|
|
+ { label: '门票', value: '免费' }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 5,
|
|
|
+ latitude: 37.058161,
|
|
|
+ longitude: 118.406168,
|
|
|
+ width: 30, // 添加宽度
|
|
|
+ height: 30, // 添加高度
|
|
|
+ title: '东营市历史博物馆',
|
|
|
+ address: '广饶街道月河路270号',
|
|
|
+ iconPath: '/images/red-marker.png',
|
|
|
+ callout: {
|
|
|
+ content: '东营市历史博物馆\n中共刘集支部旧址所在地',
|
|
|
+ color: '#000',
|
|
|
+ fontSize: 14,
|
|
|
+ borderRadius: 5,
|
|
|
+ bgColor: '#fff',
|
|
|
+ padding: 5,
|
|
|
+ display: 'ALWAYS'
|
|
|
+ },
|
|
|
+ imageUrl: 'https://bkimg.cdn.bcebos.com/pic/6a600c338744ebf816436f04d8f9d72a6059a7de?x-bce-process=image/format,f_auto/resize,m_lfit,limit_1,w_504',
|
|
|
+ description: '东营市历史博物馆成立于1993年5月，坐落在东营市南部的广饶县城，东连关帝庙和孙武祠，南临月河公园，西靠月河路，北依广饶宾馆，占地面积30余亩。新馆于2002年1月开工建设，2003年10月建成，总建筑面积6812平方米，全框架结构，外观庄重大方，地上三层，地下一层，陈列总面积3500平方米。',
|
|
|
+ detail: [
|
|
|
+ { label: '开放时间', value: '夏8: 00 —11:30，14:00—17:30；冬8: 00 —11:30，13:30—17:00（周一闭馆）' },
|
|
|
+ { label: '门票', value: '免费' }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 6,
|
|
|
+ latitude: 37.540619,
|
|
|
+ longitude: 121.390736,
|
|
|
+ width: 30, // 添加宽度
|
|
|
+ height: 30, // 添加高度
|
|
|
+ title: '胶东革命纪念馆',
|
|
|
+ address: '芝罘区海岸路20号',
|
|
|
+ iconPath: '/images/red-marker.png',
|
|
|
+ callout: {
|
|
|
+ content: '胶东革命纪念馆\n胶东地区革命历史展示中心',
|
|
|
+ color: '#000',
|
|
|
+ fontSize: 14,
|
|
|
+ borderRadius: 5,
|
|
|
+ bgColor: '#fff',
|
|
|
+ padding: 5,
|
|
|
+ display: 'ALWAYS'
|
|
|
+ },
|
|
|
+ imageUrl: 'https://bkimg.cdn.bcebos.com/pic/c8177f3e6709c93d70cf743ec971efdcd100bba1feec?x-bce-process=image/format,f_auto/quality,Q_70/resize,m_lfit,limit_1,w_536',
|
|
|
+ description: '胶东革命纪念馆位于烟台，占地面积5600平方米，展陈面积2800平方米，旧址于1865年修建，是全国重点文物保护单位。2018年7月1日起，该馆面向市民免费开放，每周一、周四闭馆。基本陈列包括英雄胶东、奋发图强、走向辉煌三个部分，展示了胶东人民在中国共产党领导下近百年来从苦难到辉煌。',
|
|
|
+ detail: [
|
|
|
+ { label: '开放时间', value: '9：00——16:00（每周一、周四闭馆法定节假日除外）' },
|
|
|
+ { label: '门票', value: '免费' }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 7,
|
|
|
+ latitude: 36.707668,
|
|
|
+ longitude: 119.161748,
|
|
|
+ width: 30, // 添加宽度
|
|
|
+ height: 30, // 添加高度
|
|
|
+ title: '潍县集中营旧址',
|
|
|
+ address: '奎文区广文街道',
|
|
|
+ iconPath: '/images/red-marker.png',
|
|
|
+ callout: {
|
|
|
+ content: '潍县集中营旧址\n二战期间亚洲最大侨民集中营',
|
|
|
+ color: '#000',
|
|
|
+ fontSize: 14,
|
|
|
+ borderRadius: 5,
|
|
|
+ bgColor: '#fff',
|
|
|
+ padding: 5,
|
|
|
+ display: 'ALWAYS'
|
|
|
+ },
|
|
|
+ imageUrl: 'https://www.iwenbo.fun/storage/heritage/20210131/60169f37505f5.jpg',
|
|
|
+ description: '潍县西方侨民集中营旧址，又名乐道院集中营、山东集中营，位于山东省潍坊市奎文区乐道院。清光绪八年（1882年），美国基督教长老会派牧师狄乐播偕夫人阿撤拉氏（一说为狄珍珠）来潍县传教，在老潍县东关处买地建立"乐道院"，乐道院由教堂、学堂、诊所3部分组成，用以传教、办学和开办诊所。民国三十一年（1942年）至民国三十四年（1945年），日军在潍县西方侨民集中营旧址设立"敌国人员生活所"，一度成为二战期间亚洲境内最大的"集中营"。从1996年起，潍坊市政府先后投资对潍县西方侨民集中营旧址十字楼进行了修缮，建设纪念碑和乐道广场、乐道雕塑，建成展览馆和陈列馆，并对周边河道进行了治理，进行"乐道钟声"景观公园建设，对观众免费开放。作为二战期间亚洲最大的外国侨民集中营旧址——潍县西方侨民集中营旧址，承载着世界反法西斯战争共同的伤痛记忆，对于拓宽公共外交空间具有不可替代的地位和重要作用。2019年10月，潍县西方侨民集中营旧址被中华人民共和国国务院公布为第八批全国重点文物保护单位。',
|
|
|
+ detail: [
|
|
|
+ { label: '开放时间', value: '夏9:00-17:00；冬9:00-16:30（周一闭馆）' },
|
|
|
+ { label: '门票', value: '免费' }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 8,
|
|
|
+ latitude: 35.414921,
|
|
|
+ longitude: 116.587116,
|
|
|
+ width: 30, // 添加宽度
|
|
|
+ height: 30, // 添加高度
|
|
|
+ title: '微山湖抗日英烈纪念园',
|
|
|
+ address: '微山县微山岛镇',
|
|
|
+ iconPath: '/images/red-marker.png',
|
|
|
+ callout: {
|
|
|
+ content: '微山湖抗日纪念园\n铁道游击队主要活动区域',
|
|
|
+ color: '#000',
|
|
|
+ fontSize: 14,
|
|
|
+ borderRadius: 5,
|
|
|
+ bgColor: '#fff',
|
|
|
+ padding: 5,
|
|
|
+ display: 'ALWAYS'
|
|
|
+ },
|
|
|
+ imageUrl: 'https://bkimg.cdn.bcebos.com/pic/34fae6cd7b899e510fb319ddf4fece33c895d043a7fb?x-bce-process=image/format,f_auto/watermark,image_d2F0ZXIvYmFpa2UyNzI,g_7,xp_5,yp_5,P_20/resize,m_lfit,limit_1,h_1080',
|
|
|
+ description: '微山湖英烈纪念园，位于山东省微山县夏镇西港，始建于1982年，共投资1100余万元，占地33000平方米，原名为微山县烈士陵园，是为纪念微山湖区革命武装和湖区人民团结抗日，浴血奋战而修建的烈士纪念设施。微山湖英烈纪念园内安葬不同时期牺牲的革命烈士587名。著名烈士有"华东战斗英雄"郭继胜、抗日英雄褚雅青、爆破英雄种衍海等。著名战斗主要有杏园战斗、部城遭遇战、收复微山岛、大捐战斗、南庄战斗、程子庙战斗等。纪念园内主要建筑物有微山湖抗日游击大队纪念碑、微山县烈士英名碑、著名烈士墓区、鲁南战役烈士纪念碑、微山湖区党史纪念馆、文史馆等。整座纪念园布局严谨，绿草如茵，松柏苍翠。2014年，经济宁市人民政府批准，微山湖英烈纪念园被列入市级烈士纪念设施保护单位。',
|
|
|
+ detail: [
|
|
|
+ { label: '开放时间', value: '8:30—17:30（农历除夕至大年初三闭园）' },
|
|
|
+ { label: '门票', value: '免费' }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 9,
|
|
|
+ latitude: 36.200371,
|
|
|
+ longitude: 117.087614,
|
|
|
+ width: 30, // 添加宽度
|
|
|
+ height: 30, // 添加高度
|
|
|
+ title: '陆房突围胜利纪念馆',
|
|
|
+ address: '肥城市安临站镇',
|
|
|
+ iconPath: '/images/red-marker.png',
|
|
|
+ callout: {
|
|
|
+ content: '陆房突围纪念馆\n八路军115师突围战纪念地',
|
|
|
+ color: '#000',
|
|
|
+ fontSize: 14,
|
|
|
+ borderRadius: 5,
|
|
|
+ bgColor: '#fff',
|
|
|
+ padding: 5,
|
|
|
+ display: 'ALWAYS'
|
|
|
+ },
|
|
|
+ imageUrl: 'https://tse2-mm.cn.bing.net/th/id/OIP-C.rMYotSx3O8zaY_LHeW03NgHaE8?w=246&h=180&c=7&r=0&o=7&dpr=1.8&pid=1.7&rm=3',
|
|
|
+ description: '陆房突围胜利纪念馆是为纪念1939年八路军一一五师陆房突围战役而设立的专题纪念馆。该馆始建于1971年，2015年完成扩建后建筑面积达5300平方米，现陈列包含战斗文物、历史文献及军民生活用品等260件/套藏品。截至2023年，年接待量达18万人次，累计接待单位400余个。2024年8月获评国家二级博物馆，同时被列为国家级抗战纪念设施、遗址及省级爱国主义教育基地',
|
|
|
+ detail: [
|
|
|
+ { label: '开放时间', value: '夏9:00 - 11:30，15:00 - 17:30；冬9:00 - 11:30，14:30 - 17:00（周一闭馆）' },
|
|
|
+ { label: '门票', value: '免费' }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 10,
|
|
|
+ latitude: 37.501314,
|
|
|
+ longitude: 122.113556,
|
|
|
+ width: 30, // 添加宽度
|
|
|
+ height: 30, // 添加高度
|
|
|
+ title: '天福山起义纪念馆',
|
|
|
+ address: '文登区天福山',
|
|
|
+ iconPath: '/images/red-marker.png',
|
|
|
+ callout: {
|
|
|
+ content: '天福山起义纪念馆\n山东人民抗日救国军诞生地',
|
|
|
+ color: '#000',
|
|
|
+ fontSize: 14,
|
|
|
+ borderRadius: 5,
|
|
|
+ bgColor: '#fff',
|
|
|
+ padding: 5,
|
|
|
+ display: 'ALWAYS'
|
|
|
+ },
|
|
|
+ imageUrl: 'https://example.com/tianfu-mountain.jpg',
|
|
|
+ description: '天福山起义纪念馆位于山东省威海市文登区文登营镇天福山森林公园中心，建筑面积450平方米，陈列面积420平方米。1989年，拆除原有简易展厅，在原址上重新扩建420平方米平房展厅。主要陈列有《天福山起义原址》《中共胶东特委会议旧址》《天福山武装起义会场》《天福山起义纪念塔》等。主要藏品有《三军战士用过的枪支》《军旗、军号、印鉴》《大刀、铁矛头、节鞭》等文物藏品。截至2019年末，天福天福山起义纪念馆先后获得"山东省爱国主义教育基地"、"山东省优秀国防教育基地"等荣誉称号。',
|
|
|
+ detail: [
|
|
|
+ { label: '开放时间', value: '8:30-11:00,13:30-17:00（周一闭馆）' },
|
|
|
+ { label: '门票', value: '免费' }
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ storyList: [
|
|
|
+ {
|
|
|
+ id: 1,
|
|
|
+ cover: '/images/index/台儿庄.jpg',
|
|
|
+ title: '台儿庄战役'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 2,
|
|
|
+ cover: '/images/index/沂蒙山革命.webp',
|
|
|
+ title: '沂蒙山革命'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 3,
|
|
|
+ cover: '/images/index/济南革命烈士.jpg',
|
|
|
+ title: '济南革命烈士'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 4,
|
|
|
+ cover: '/images/index/铁道游击队.webp',
|
|
|
+ title: '铁道游击队'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 5,
|
|
|
+ cover: '/images/index/莱芜战役.jpg',
|
|
|
+ title: '莱芜战役'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 6,
|
|
|
+ cover: '/images/index/羊山战役.png',
|
|
|
+ title: '阳山战役'
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ vrList: [
|
|
|
+ {
|
|
|
+ id: 1,
|
|
|
+ title: "聊城革命烈士陵园",
|
|
|
+ desc: "360°全景展示",
|
|
|
+ thumb: "https://bkimg.cdn.bcebos.com/pic/43a7d933c895d143ad4bb00002a995025aafa40fa9c5?x-bce-process=image/format,f_auto/quality,Q_70/resize,m_lfit,limit_1,w_536",
|
|
|
+ url: "https://www.720yun.com/vr/f27j5puurv1"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 2,
|
|
|
+ title: "台儿庄大战纪念馆",
|
|
|
+ desc: "沉浸式VR体验",
|
|
|
+ thumb: "https://bkimg.cdn.bcebos.com/pic/58ee3d6d55fbb2fbee8d1683414a20a44723dcf9?x-bce-process=image/format,f_auto/watermark,image_d2F0ZXIvYmFpa2UyNzI,g_7,xp_5,yp_5,P_20/resize,m_lfit,limit_1,h_1080",
|
|
|
+ url: "https://www.720yun.com/vr/6f4jtrwaOn5"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 3,
|
|
|
+ title: "鲁西南战役纪念馆",
|
|
|
+ desc: "刘邓大军千里跃进",
|
|
|
+ thumb: "https://bkimg.cdn.bcebos.com/pic/7a899e510fb30f2442a7769cd7dac643ad4bd113a557?x-bce-process=image/format,f_auto/quality,Q_70/resize,m_lfit,limit_1,w_536",
|
|
|
+ url: "https://www.720yun.com/vr/a982acOfyna"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 4,
|
|
|
+ title: "孟良崮战役纪念馆",
|
|
|
+ desc: "解放战争",
|
|
|
+ thumb: "https://bkimg.cdn.bcebos.com/pic/b3119313b07eca806538b17b007280dda144ad342557?x-bce-process=image/format,f_auto/watermark,image_d2F0ZXIvYmFpa2UyNzI,g_7,xp_5,yp_5,P_20/resize,m_lfit,limit_1,h_1080",
|
|
|
+ url: "https://www.720yun.com/vr/3d9jOstmrk2"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 5,
|
|
|
+ title: "昌邑抗日殉国烈士祠",
|
|
|
+ desc: "全国重点文物保护单位",
|
|
|
+ thumb: "http://www.changyibwg.cn/upload/default/20200509/756dff458ee61cb41428e42b9b2019e5.jpg",
|
|
|
+ url: "https://www.720yun.com/vr/5fajOstmrk4"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ touchStartX: 0,
|
|
|
+ touchStartY: 0,
|
|
|
+ positionX: 0,
|
|
|
+ positionY: 0,
|
|
|
+ showMenu: false,
|
|
|
+ walking: false,
|
|
|
+ windowWidth: 0,
|
|
|
+ windowHeight: 0
|
|
|
+ },
|
|
|
+
|
|
|
+ onLoad: function(options) {
|
|
|
+ this.getLayoutRecommendation();
|
|
|
+ this.mapCtx = wx.createMapContext('map');
|
|
|
+ wx.getSystemInfo({
|
|
|
+ success: (res) => {
|
|
|
+ this.setData({
|
|
|
+ windowWidth: res.windowWidth,
|
|
|
+ windowHeight: res.windowHeight,
|
|
|
+ positionX: res.windowWidth - 80,
|
|
|
+ positionY: res.windowHeight - 180
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getLayoutRecommendation() {
|
|
|
+ wx.request({
|
|
|
+ url: 'http://127.0.0.1:8000/api/recommend-layout/',
|
|
|
+ method: 'GET',
|
|
|
+ header: {
|
|
|
+ 'Authorization': `Token ${app.globalData.userInfo.token}`
|
|
|
+ },
|
|
|
+ success: (res) => {
|
|
|
+ console.log('布局推荐:', res.data);
|
|
|
+ this.setData({
|
|
|
+ layoutType: res.data.layout_type,
|
|
|
+ featureWeights: res.data.feature_weights
|
|
|
+ });
|
|
|
+ },
|
|
|
+ fail: (err) => {
|
|
|
+ console.error('获取布局失败:', err);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ generateFeatureLayout(weights) {
|
|
|
+ // 根据权重生成特征布局
|
|
|
+ const features = [
|
|
|
+ {feature: 'ai-plan', name: '红途定制', image: '/images/index/生成攻略.png'},
|
|
|
+ {feature: 'gongjiao', name: '游学路线', image: '/images/index/游学路线.png'},
|
|
|
+ {feature: 'search', name: '红游速搜', image: '/images/搜索分类.png'},
|
|
|
+ {feature: 'quiz', name: '红史问答', image: '/images/quiz-icon.png'}
|
|
|
+ ];
|
|
|
+
|
|
|
+ // 根据权重排序
|
|
|
+ return features.sort((a, b) => weights[b.feature] - weights[a.feature])
|
|
|
+ .map((item, index) => ({
|
|
|
+ ...item,
|
|
|
+ size: this.getSizeClass(index)
|
|
|
+ }));
|
|
|
+ },
|
|
|
+
|
|
|
+ getSizeClass(index) {
|
|
|
+ // 根据位置决定大小
|
|
|
+ return index === 0 ? 'large' : (index < 3 ? 'medium' : 'small');
|
|
|
+ },
|
|
|
+
|
|
|
+ applyLayoutStyle() {
|
|
|
+ // 动态应用布局样式
|
|
|
+ const config = this.data.layoutConfig;
|
|
|
+ const query = wx.createSelectorQuery();
|
|
|
+
|
|
|
+ query.select('.map-container').boundingClientRect();
|
|
|
+ query.select('.menu').boundingClientRect();
|
|
|
+ query.select('.vr-container').boundingClientRect();
|
|
|
+ query.exec(res => {
|
|
|
+ res[0].node.setStyle({height: `${config.map * 100}vh`});
|
|
|
+ res[1].node.setStyle({display: config.features > 0.3 ? 'block' : 'none'});
|
|
|
+ res[2].node.setStyle({height: `${config.vr * 100}vh`});
|
|
|
+ });
|
|
|
+ },
|
|
|
+ onSearchInput: function(e) {
|
|
|
+ this.setData({
|
|
|
+ searchText: e.detail.value
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
+ searchLocation: function(keyword) {
|
|
|
+ const qqMapKey = 'LOABZ-FH4LW-PGHRL-Y73W4-7WMNF-BHFQ5'; // 您的真实KEY
|
|
|
+ wx.request({
|
|
|
+ url: `https://apis.map.qq.com/ws/place/v1/search`,
|
|
|
+ data: {
|
|
|
+ keyword: keyword,
|
|
|
+ boundary: 'region(山东,0)', // 限定山东范围
|
|
|
+ key: qqMapKey
|
|
|
+ },
|
|
|
+
|
|
|
+ success: (res) => {
|
|
|
+ wx.hideLoading();
|
|
|
+ if (res.data.status === 0 && res.data.data) {
|
|
|
+ this.processSearchResults(res.data.data);
|
|
|
+ } else {
|
|
|
+ wx.showToast({
|
|
|
+ title: res.data.message || '搜索失败',
|
|
|
+ icon: 'none'
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ fail: (err) => {
|
|
|
+ wx.hideLoading();
|
|
|
+ console.error('API请求失败:', err);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ addMarker: function(location) {
|
|
|
+ if (!this.mapCtx) {
|
|
|
+ this.mapCtx = wx.createMapContext('map');
|
|
|
+ }
|
|
|
+
|
|
|
+ const newMarker = {
|
|
|
+ id: Date.now(),
|
|
|
+ latitude: location.lat,
|
|
|
+ longitude: location.lng,
|
|
|
+ title: location.name,
|
|
|
+ iconPath: '/images/地点.png',
|
|
|
+ width: 30,
|
|
|
+ height: 30,
|
|
|
+ callout: {
|
|
|
+ content: location.name,
|
|
|
+ color: '#fff',
|
|
|
+ bgColor: '#d32f2f',
|
|
|
+ padding: 8,
|
|
|
+ borderRadius: 4
|
|
|
+ },
|
|
|
+ imageUrl: location.imageUrl || '/images/default.jpg',
|
|
|
+ address: location.address,
|
|
|
+ description: location.description,
|
|
|
+ detail: location.detail || []
|
|
|
+ };
|
|
|
+
|
|
|
+ this.setData({
|
|
|
+ latitude: location.lat,
|
|
|
+ longitude: location.lng,
|
|
|
+ scale: 12,
|
|
|
+ markers: [newMarker]
|
|
|
+ });
|
|
|
+
|
|
|
+ this.mapCtx.moveToLocation();
|
|
|
+ setTimeout(() => {
|
|
|
+ this.mapCtx.translateMarker({
|
|
|
+ markerId: newMarker.id,
|
|
|
+ autoRotate: true,
|
|
|
+ duration: 1000
|
|
|
+ });
|
|
|
+ }, 500);
|
|
|
+ },
|
|
|
+ // 点击按钮触发位置选择
|
|
|
+chooseLocation: function() {
|
|
|
+ const that = this;
|
|
|
+ wx.chooseLocation({
|
|
|
+ success: (res) => {
|
|
|
+ console.log('选择的位置:', res);
|
|
|
+
|
|
|
+ // 生成绿色搜索标记（与原有红色标记共存）
|
|
|
+ const newMarker = {
|
|
|
+ id: Date.now(), // 动态ID避免冲突
|
|
|
+ latitude: res.latitude,
|
|
|
+ longitude: res.longitude,
|
|
|
+ title: res.name || '已选位置',
|
|
|
+ address: res.address,
|
|
|
+ iconPath: '/images/search-marker.png', // 绿色标记图标
|
|
|
+ width: 30,
|
|
|
+ height: 30,
|
|
|
+ callout: {
|
|
|
+ content: res.name,
|
|
|
+ color: '#fff',
|
|
|
+ bgColor: '#07c160',
|
|
|
+ padding: 8,
|
|
|
+ display: 'ALWAYS'
|
|
|
+ }
|
|
|
+ };
|
|
|
+
|
|
|
+ that.setData({
|
|
|
+ searchMarkers: [newMarker], // 替换旧搜索标记
|
|
|
+ latitude: res.latitude, // 移动视角到选中位置
|
|
|
+ longitude: res.longitude,
|
|
|
+ scale: 16
|
|
|
+ });
|
|
|
+ },
|
|
|
+ fail: (err) => {
|
|
|
+ console.error('位置选择失败:', err);
|
|
|
+ wx.showToast({ title: '位置选择取消', icon: 'none' });
|
|
|
+ }
|
|
|
+ });
|
|
|
+},
|
|
|
+onSearchConfirm: function() {
|
|
|
+ wx.request({
|
|
|
+ url: 'https://apis.map.qq.com/ws/place/v1/search',
|
|
|
+ success: (res) => {
|
|
|
+ this.setData({
|
|
|
+ // 生成绿色搜索标记（ID从10000开始避免冲突）
|
|
|
+ searchMarkers: res.data.data.map((item, index) => ({
|
|
|
+ id: 10000 + index,
|
|
|
+ latitude: item.location.lat,
|
|
|
+ longitude: item.location.lng,
|
|
|
+ title: item.title,
|
|
|
+ iconPath: '/images/search-marker.png', // 绿色图标
|
|
|
+ width: 30,
|
|
|
+ height: 30,
|
|
|
+ callout: {
|
|
|
+ content: item.title,
|
|
|
+ color: '#fff',
|
|
|
+ bgColor: '#07c160', // 绿色背景
|
|
|
+ display: 'BYCLICK' // 点击才显示，避免遮挡
|
|
|
+ }
|
|
|
+ })),
|
|
|
+ // 保持原有视野不变（避免红色标记移出屏幕）
|
|
|
+ latitude: this.data.latitude,
|
|
|
+ longitude: this.data.longitude
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+},
|
|
|
+ // 在搜索成功的回调中：
|
|
|
+processSearchResults(results) {
|
|
|
+ this.setData({
|
|
|
+ searchMarkers: results.map((item, index) => ({
|
|
|
+ id: 10000 + index, // 确保ID不冲突
|
|
|
+ latitude: item.location.lat,
|
|
|
+ longitude: item.location.lng,
|
|
|
+ title: item.title,
|
|
|
+ iconPath: '/images/search-marker.png',
|
|
|
+ width: 30,
|
|
|
+ height: 30
|
|
|
+ })),
|
|
|
+ showSearchMarkers: true,
|
|
|
+ // 自动定位到第一个结果
|
|
|
+ latitude: results[0].location.lat,
|
|
|
+ longitude: results[0].location.lng,
|
|
|
+ scale: 15
|
|
|
+ });
|
|
|
+},// 标记点击事件处理（兼容原有红标和新绿标）
|
|
|
+onMarkerTap: function(e) {
|
|
|
+ const markerId = e.detail.markerId;
|
|
|
+
|
|
|
+
|
|
|
+ const redMarker = this.data.markers.find(m => m.id === markerId);
|
|
|
+ if (redMarker) {
|
|
|
+ this.setData({
|
|
|
+ currentMarker: redMarker,
|
|
|
+ showImageModal: true // 显示详情弹窗
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+},
|
|
|
+
|
|
|
+ hideImageModal: function() {
|
|
|
+ this.setData({
|
|
|
+ showImageModal: false
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ stopPropagation: function() {
|
|
|
+ return;
|
|
|
+ },
|
|
|
+
|
|
|
+ openLocation: function() {
|
|
|
+ if (!this.data.currentMarker) return;
|
|
|
+
|
|
|
+ wx.openLocation({
|
|
|
+ latitude: this.data.currentMarker.latitude,
|
|
|
+ longitude: this.data.currentMarker.longitude,
|
|
|
+ name: this.data.currentMarker.title,
|
|
|
+ address: this.data.currentMarker.address
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ showWebView: function(e) {
|
|
|
+ const { url, title } = e.currentTarget.dataset;
|
|
|
+ wx.navigateTo({
|
|
|
+ url: `/pages/vr-detail/vr-detail?url=${encodeURIComponent(url)}&title=${encodeURIComponent(title)}`
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ hideWebView: function() {
|
|
|
+ this.setData({
|
|
|
+ showWebView: false,
|
|
|
+ webViewUrl: "",
|
|
|
+ currentVrTitle: ""
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ touchStart: function(e) {
|
|
|
+ this.setData({
|
|
|
+ touchStartX: e.touches[0].clientX,
|
|
|
+ touchStartY: e.touches[0].clientY
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ touchMove: function(e) {
|
|
|
+ const { touchStartX, touchStartY } = this.data;
|
|
|
+ const moveX = e.touches[0].clientX - touchStartX;
|
|
|
+ const moveY = e.touches[0].clientY - touchStartY;
|
|
|
+
|
|
|
+ this.setData({
|
|
|
+ positionX: this.data.positionX + moveX,
|
|
|
+ positionY: this.data.positionY + moveY,
|
|
|
+ touchStartX: e.touches[0].clientX,
|
|
|
+ touchStartY: e.touches[0].clientY
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ touchEnd: function() {
|
|
|
+ const { positionX, positionY, windowWidth, windowHeight } = this.data;
|
|
|
+ const btnSize = 80;
|
|
|
+
|
|
|
+ let finalX = positionX;
|
|
|
+ let finalY = positionY;
|
|
|
+
|
|
|
+ if (positionX < 0) finalX = 0;
|
|
|
+ if (positionX > windowWidth - btnSize) finalX = windowWidth - btnSize;
|
|
|
+ if (positionY < 0) finalY = 0;
|
|
|
+ if (positionY > windowHeight - btnSize) finalY = windowHeight - btnSize;
|
|
|
+
|
|
|
+ this.setData({
|
|
|
+ positionX: finalX,
|
|
|
+ positionY: finalY
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ showFloatMenu: function() {
|
|
|
+ this.setData({
|
|
|
+ showMenu: true
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ hideFloatMenu: function() {
|
|
|
+ this.setData({
|
|
|
+ showMenu: false
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ doFunction1: function() {
|
|
|
+ this.setData({ showMenu: false });
|
|
|
+ wx.showToast({
|
|
|
+ title: '功能1已触发',
|
|
|
+ icon: 'none'
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ doFunction2: function() {
|
|
|
+ this.setData({ showMenu: false });
|
|
|
+ wx.navigateTo({
|
|
|
+ url: '/pages/function2/function2'
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ doFunction3: function() {
|
|
|
+ this.setData({ showMenu: false });
|
|
|
+ wx.showModal({
|
|
|
+ title: '提示',
|
|
|
+ content: '确定执行功能3吗？',
|
|
|
+ success(res) {
|
|
|
+ if (res.confirm) {
|
|
|
+ wx.showToast({
|
|
|
+ title: '功能3已执行',
|
|
|
+ icon: 'success'
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ navigateTopage: function(e) {
|
|
|
+ const pagePath = e.currentTarget.dataset.url;
|
|
|
+ if (pagePath) {
|
|
|
+ wx.navigateTo({
|
|
|
+ url: pagePath,
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ wx.showToast({
|
|
|
+ title: '功能开发中',
|
|
|
+ icon: 'none'
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ viewGallery: function(e) {
|
|
|
+ const id = e.currentTarget.dataset.id;
|
|
|
+ wx.navigateTo({
|
|
|
+ url: `/pages/gallery/detail?id=${id}`
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ onReady: function() {
|
|
|
+ // 页面初次渲染完成
|
|
|
+ },
|
|
|
+
|
|
|
+ onShow: function() {
|
|
|
+ // 页面显示
|
|
|
+ this.getRecommendLayout();
|
|
|
+ },
|
|
|
+ getRecommendLayout: function() {
|
|
|
+ const token = wx.getStorageSync('token');
|
|
|
+ if (!token) return;
|
|
|
+
|
|
|
+ wx.request({
|
|
|
+ url: 'https://your-api-domain.com/api/recommend-layout/',
|
|
|
+ header: {
|
|
|
+ 'Authorization': `Token ${token}`
|
|
|
+ },
|
|
|
+ success: (res) => {
|
|
|
+ if (res.statusCode === 200) {
|
|
|
+ console.log('布局推荐:', res.data);
|
|
|
+ this.applyLayoutConfig(res.data);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ applyLayoutConfig: function(data) {
|
|
|
+ const layoutMap = {
|
|
|
+ 'map_focused': { map: 0.7, vr: 0.2 },
|
|
|
+ 'vr_focused': { map: 0.4, vr: 0.4 },
|
|
|
+ 'feature_focused': { map: 0.5, vr: 0.3 },
|
|
|
+ 'default': { map: 0.6, vr: 0.3 }
|
|
|
+ };
|
|
|
+
|
|
|
+ // 设置布局类型
|
|
|
+ const layoutType = data.layout_type || 'default';
|
|
|
+ this.setData({
|
|
|
+ layoutConfig: layoutMap[layoutType],
|
|
|
+ featureLayout: this.generateFeatureLayout(data.recommended_order)
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ // 生成功能布局
|
|
|
+ generateFeatureLayout: function(features) {
|
|
|
+ // 根据推荐顺序生成不同大小的布局项
|
|
|
+ return features.map((feature, index) => {
|
|
|
+ return {
|
|
|
+ feature: feature,
|
|
|
+ size: index < 2 ? 'large' : (index < 4 ? 'medium' : 'small')
|
|
|
+ };
|
|
|
+ }).slice(0, 6); // 只显示前6个功能
|
|
|
+ },
|
|
|
+
|
|
|
+ recordFeatureUsage(featureName) {
|
|
|
+ const app = getApp();
|
|
|
+ console.log('发送的Token:', app.globalData.userInfo.token);
|
|
|
+ console.log('发送的featureName:', featureName);
|
|
|
+
|
|
|
+ wx.request({
|
|
|
+ url: 'http://127.0.0.1:8000/api/record-usage/',
|
|
|
+ method: 'POST',
|
|
|
+ header: {
|
|
|
+ 'Authorization': `Token ${app.globalData.userInfo.token}`,
|
|
|
+ 'Content-Type': 'application/json' // 确保这个请求头存在
|
|
|
+ },
|
|
|
+ data: JSON.stringify({ // 关键修改：必须使用JSON.stringify
|
|
|
+ feature_name: featureName // 参数名必须与后端一致
|
|
|
+ }),
|
|
|
+ success: (res) => {
|
|
|
+ console.log('行为记录响应:', res.data);
|
|
|
+ },
|
|
|
+ fail: (err) => {
|
|
|
+ console.error('请求失败:', err);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ onHide: function() {
|
|
|
+ // 页面隐藏
|
|
|
+ },
|
|
|
+
|
|
|
+ onUnload: function() {
|
|
|
+ // 页面卸载
|
|
|
+ },
|
|
|
+
|
|
|
+ onPullDownRefresh: function() {
|
|
|
+ wx.stopPullDownRefresh();
|
|
|
+ },
|
|
|
+
|
|
|
+ onReachBottom: function() {
|
|
|
+ // 上拉加载更多
|
|
|
+ },
|
|
|
+
|
|
|
+ onShareAppMessage: function() {
|
|
|
+ return {
|
|
|
+ title: '山东红色景点地图',
|
|
|
+ path: '/pages/index/jingdianchaxun/jingdianchaxun',
|
|
|
+ imageUrl: '/images/share.jpg'
|
|
|
+ };
|
|
|
+ },
|
|
|
+
|
|
|
+ onPageScroll: function() {
|
|
|
+ // 页面滚动
|
|
|
+ },
|
|
|
+
|
|
|
+ onTabItemTap: function(item) {
|
|
|
+ // tab点击
|
|
|
+ },
|
|
|
+
|
|
|
+ onResize: function() {
|
|
|
+ // 页面尺寸变化
|
|
|
+ }
|
|
|
+});
|
zzz