Lopwon Marker 使用文档

2023-09-02


版本型号:Lopwon Marker
适用程序:Typecho
皮肤类型:页面模板
模板作者:Lopwon
作者博客:Lopwon.com
发布页面:Lopwon.com/lopwon-marker.html
官方演示:Lopwon Marker单页式
网友案例:(留言申请)

我要使用:电邮 lopwon@qq.com


模板说明

模板 Lopwon Marker 的作用是:依托百度地图开放平台,在地图上标记地理位置坐标点和相关信息,实现“我的探店”效果。相较于之前制作的 Lopwon FootprintLopwon Track 模板,Lopwon Marker 在添加标记(坐标点)信息上,更灵活便捷,还可以对标记进行分类赋色,一目了然,适合呈现:我的城市探店、我的城市漫步、我的城市打卡等效果。

模板 Lopwon Marker 的制作源自网友 #FireCoralFish 提出的需求。


模板更新

2023年09月02日 发布 Lopwon Marker


使用方法

A 申请秘钥

Lopwon Marker 的使用,需要先申请百度地图开放平台提供的免费API秘钥(AK)。

1. 访问百度地图开放平台(https://lbsyun.baidu.com/)注册后登陆“控制台”。

2. 应用管理》我的应用》创建应用,需要实名认证!

3. 除“应用类型”选择“浏览器端”外,其他可以默认。

4. 完成创建后,会生成一串API秘钥(AK)。

B 部署文件

1. 将压缩包里的文件夹 Lopwon 及其内部的所有文件,和文件 Lopwon_Marker.php 上传至目录 usr/themes 中的你的主题文件夹里。如:你的主题文件夹是 default,那么就上传至 usr/themes/default 里。

C 配置页面

后台》管理》独立页面》新增,新建独立页面,除以下提到的事项外,其余正常操作即可。

1. 此编辑页面右侧的“自定义模板”里,请选择“Lopwon Marker”。

2. 此编辑页面右侧的“高级选项”,在“公开度”选择“隐藏”后,可将此页面的标题不展示在某些主题的分类菜单里。

3. 此编辑页面下方的“自定义字段”,请按以下介绍新增自定义字段:

一、填入秘钥(必选项)。

1. 新增自定义字段,字段名称填入 mapAPI,乱填无效,字段值填入之前获取的(AK)。

二、中心坐标(可选项)。作用是:以自定义的坐标作为地图的视窗中心,如果不创建该字段,则默认为北京的坐标。

1. 新增自定义字段,字段名称填入 mapCenter,乱填无效,字段值填入格式为(经度,纬度)的坐标值,例116.403963,39.915119

2. 提示:访问拾取坐标系统(http://api.map.baidu.com/lbsapi/getpoint/index.html)获取坐标。

三、缩放级别(可选项)。作用是:以自定义的级别作为地图的展示级别,如果不创建该字段,则默认为 13 级。

1. 新增自定义字段,字段名称填入 mapZoom,乱填无效,字段值填入 3~19 的任意整数,数值越大,级别越大。

四、标记颜色(可选项)。作用是:以自定义的颜色作为地图的标记颜色,如果不创建该字段,则使用默认颜色。

1. 新增自定义字段,字段名称填入 mapColor,乱填无效,字段值填入 5 个合法的 CSS 颜色值(如:red 或 #ff0000),并以半角逗号隔开,格式如下:

    green,yellow,red,pink,white

    或者(十六进制型)

    #008000,#ffff00,#ff0000,#ffc0cb,#ffffff

    或者(组合型)

    green,#ffff00,#ff0000,pink,#ffffff

2. 注意:以上 5 个颜色值按顺序依次自定义以下类别的颜色:

    好评,中评,差评,待探索,未定义类别

D 添加内容

在此编辑页面右侧的“附件”里,上传图片,每张图片相当于一个标记(坐标点):

1. 上传图片后,点击每个图片附件的“编辑”(铅笔状图标),进入图片信息的编辑页面:

① 在右侧(标题)栏输入标记的名称,如:麦当劳、肯德基;

② 在(缩略名)栏输入标记的坐标,格式为(经度,纬度)的坐标值,如:102.721996,25.047826

③ 在(描述)栏输入标记的描述,如:评分、评价、简介等等,支持使用 Markdown 语法插入文本链接等,如下

    [链接文本](链接)

④ 注意:在(缩略名)栏中输入坐标值后,Typecho 默认会把坐标值的点和逗号转换为横杠,无需理会,模板已做格式处理。

给以上创建的标记(坐标点)添加类别属性(好评,中评,差评,待探索),同时也是给坐标点赋色的依据。

1. 在以上提到的(描述)栏里,只要内容中包含对应关键词,即可自动给标记进行分类,如下:

① 描述内容中,若包含 rate-5 或 rate-4 则为(好评)类别,标记将使用(好评)的颜色,且前台将输出(五星、四星)图标。

② 描述内容中,若包含 rate-3 或 rate-2 则为(中评)类别,标记将使用(中评)的颜色,且前台将输出(三星、二星)图标。

③ 描述内容中,若包含 rate-1 或 rate-0 则为(差评)类别,标记将使用(差评)的颜色,且前台将输出(一星、红叉)图标。

④ 描述内容中,若包含 todo 则为(待探索)类别,标记将使用(待探索)的颜色,且前台将输出(待探索)图标。

⑤ 描述内容中,若都不包含以上关键词,标记将使用(未定义类别)的颜色。

2. 描述内容示例:

    评分:rate-1
    评价:嘴巴太小,汉堡太大,不能让人斯文进食!
    官网:[汉堡王(中国)](https://www.bkchina.cn/)

    测试:这是长文本测试,汉堡王中国除了传承了这个品牌风靡全球的成功之道外,更升级了顾客在餐厅的用餐体验并推出了适合中国消费者口味的美味产品,使之同时具有”快餐厅“和”休闲餐厅“的特色和优势,即快餐厅的速度,便捷和面向大众的价位,以及休闲餐厅的时尚舒适的环境和优质美味的食物。

以上示例,前台则显示为(图示)。

提示:描述内容中,包含关键词 rate- 或 todo 用于给坐标点分类和赋色,如果没有这些需求时,可以不使用,如果有需求但又不想在前台显示(评分图标),只需要在原有关键词前面添加 none- 即可,如 none-rate-3 或 none-todo

E 使用技巧

1)如何更改地图样式?

1. 访问百度地图开放平台(https://lbsyun.baidu.com/)登陆“控制台”。

2. 特色服务平台》个性化地图》新建,根据喜好自定义地图,发布样式后将获取样式ID,将此ID替换到文件  Lopwon_Footprint.php 中的“地图样式” styleId: '样式ID'。

2)如何默认加载卫星地图?

1. 搜索文件 Lopwon_Footprint.php 查找 var map = new BMap.Map

2. 将 mapType: BMAP_SATELLITE_MAP, 的注释解除即可。

3)如何把“我的探店”页面嵌入指定页面?

1. 把以下代码添加至主题文章文件 post.php 的适当位置(如:文末):

    <?php if ($this->cid == '文章cid编码') { echo '<iframe src="我的探店页面链接" frameborder="0" width="100%" height="300"></iframe>'; } ?>

2. 请把以上代码中(文章cid编码)替换为你要调用"我的探店"的页面 cid 把(我的探店页面链接)替换为“我的探店”页面的链接。
Store

4 条评论

  1. 张承 1

    给我也来一份吧Lopwon Marker

    1. Lopwon Lopwon 博主
      @ 张承

      电邮 Lopwon@qq.com

  2. F FireCoralFish 4

    感谢博主及时有效回复我的需求,并迅速做出该产品,该产品满足了我的网站的“城市美食探店”地图的需求,并及时优化了部分内容,十分感谢!

    1. Lopwon Lopwon 博主
      @ FireCoralFish

      不客气。

准备下山 准备下山
Snapic Plus v5
使用 Lopwon POP 实现