【超实用工具】完蛋,我被好看的地图包围了!!!

前言

一切要从我上个月的那篇文章说起,从那以后便招来了一些极其不合理但又无法原谅的的需求

"一天完成一个系统开发"、

"3小时出一个demo(还要有UI设计)"、

"30分钟准备一个项目演示PPT"

"15分钟后看下效果ok吗?"

详情可以参考我之前的文章《原来科技感的三维地图可以这么简单实现

事情的起因

这还得从愚人节说起

突如其来的需求

2024-04-01

4月1号早上打开手机忽然看到微信里发来了消息

简直分秒必争啊,简直了,我*!

急匆匆的我

2024-04-01 09:10

一时不知道该怎么办,很急,但理智告诉我先别急,先问问GPT把景点数据搞过来

js 复制代码
[
  {
    "name": "中山陵",
    "position": {
      "latitude": 32.0683,
      "longitude": 118.8322
    }
  },
  {
    "name": "明孝陵",
    "position": {
      "latitude": 32.0507,
      "longitude": 118.8595
    }
  },
  {
    "name": "夫子庙",
    "position": {
      "latitude": 32.0227,
      "longitude": 118.7956
    }
  },
  {
    "name": "总统府",
    "position": {
      "latitude": 32.0436,
      "longitude": 118.7787
    }
  },
  {
    "name": "南京博物院",
    "position": {
      "latitude": 32.0232,
      "longitude": 118.7882
    }
  },
  {
    "name": "钟山风景名胜区",
    "position": {
      "latitude": 32.0862,
      "longitude": 118.7679
    }
  },
  {
    "name": "雨花台风景名胜区",
    "position": {
      "latitude": 31.9876,
      "longitude": 118.7823
    }
  },
  {
    "name": "南京城墙",
    "position": {
      "latitude": 32.0465,
      "longitude": 118.7946
    }
  },
  {
    "name": "瞻园",
    "position": {
      "latitude": 32.0257,
      "longitude": 118.7911
    }
  },
  {
    "name": "江宁织造博物馆",
    "position": {
      "latitude": 31.9442,
      "longitude": 118.8442
    }
  }
]

差不多了,先搞这么多吧

2024-04-01 09:20

景点数据有了,地图怎么办,先找找 高德百度 的地图API试试看

emmm,太商业化了,没一点旅游的味道,勉强能看,但写代码肯定来不及了,算了,再找找别的

打开新大陆

2024-04-01 09:25

忽然想到上篇文章里用到的 Mapmost,之前看到他们有个叫 Alpha 的低代码平台,一直没试过,不知道能不能用,算了,先打开看看再说

emmmm,感觉空空的

瞄了几眼帮助与示例里面的教程,感觉使用并不难,直接开搞吧

2024-04-01 09:30

先创建一个应用试试

点进去,发现左边一列竟然有全国的地图数据,我的天,狂喜!

尝试了搜一下南京的地图,发现各个区都有

随便拖个玄武区看看效果,啊这,感觉平平无奇,还没高德地图好看

超多好看的地图

本想着其他家的低代码平台看看效果,然后当我打开地图特效的时候,感觉立马爱上了

竟然有这么多样式可以选择!!!关键是不用写代码,拖一下就行了,perfect+1

挨个切换特效试试看咋样

  • 暮云粉

  • 青瓷蓝

  • 暗影绿

  • 翠翠绿

等等等...,看了一下,一共 20种地图样式,这下肯定能满足需求了

先用这个叫暮云粉的来一版试试吧

开始做demo交差

景点数据和地图都有了,开始把点位上图,不有又发现了一个问题,这地图只能加载一个区,没法显示南京市的,要是有全国的地图就好了,唉。

等等,全国?刚刚好像漏了什么东西,是啊,全国啊!!!!

返回场景底板列表看看,还真有全国的地图,真是想什么来什么啊,拖进去看看,还真能加载

搜一下南京市,定位过去

这下齐了,所有的区都在了,先把景点数据加上去

等一下,刚刚是不是可以搜索?那还加数据干嘛,直接搜索景点不就能定位了?

更重要的是,地图上已经有景点的数据了,也不用自己加

我直接标个点就完事了,找到图形标绘工具,加个旅游景点的图标

设置一下标题、图标大小、文字大小、颜色属性

感觉比做ppt还简单啊

同样的方式,把其他景点的图标加上去

2024-04-01 10:15

搞了几个点,差不多了,先看看效果咋样

保存,发布

然后回到工作台,看看已经发布的应用

啊哈哈哈哈,完美,拿去交差

补齐 demo 的 UI

突然发现忘了一件事,没加UI

再打开应用编辑器,找到面板,我就知道可以在线设计UI

加上标题和一些地图组件,设置一下样式

然后再看看效果,有那味了,就先这样吧,后面有时间再自己设计UI

小小的总结

先不说这个叫 Mapmost Alpha 的平台功能如何,就冲它里面有那么多地图资源,还有好看的样式,就值得案例给大家,平时用来应个急,快速出个效果还是可以的。

地图资源、模型资源、图标资源

至于在线编辑功能,就仁者见仁智者见智吧,方便了那些不会写代码的用户,至于开发者,我相信大多数还是会用SDK开发

目前这个平台可以免费试用,大家可以去白嫖一段时间试试看,也算是个小小的工具福利吧

相关推荐
M_emory_8 分钟前
解决 git clone 出现:Failed to connect to 127.0.0.1 port 1080: Connection refused 错误
前端·vue.js·git
Ciito11 分钟前
vue项目使用eslint+prettier管理项目格式化
前端·javascript·vue.js
成都被卷死的程序员1 小时前
响应式网页设计--html
前端·html
fighting ~1 小时前
react17安装html-react-parser运行报错记录
javascript·react.js·html
老码沉思录1 小时前
React Native 全栈开发实战班 - 列表与滚动视图
javascript·react native·react.js
abments1 小时前
JavaScript逆向爬虫教程-------基础篇之常用的编码与加密介绍(python和js实现)
javascript·爬虫·python
mon_star°1 小时前
将答题成绩排行榜数据通过前端生成excel的方式实现导出下载功能
前端·excel
Zrf21913184551 小时前
前端笔试中oj算法题的解法模版
前端·readline·oj算法
老码沉思录1 小时前
React Native 全栈开发实战班 - 状态管理入门(Context API)
javascript·react native·react.js
文军的烹饪实验室2 小时前
ValueError: Circular reference detected
开发语言·前端·javascript