这是一个创建于 2999 天前的主题，其中的信息可能已经有所发展或是发生改变。
嗨! 今天总算把 maptalks 的示例与文档整理得七七八八, 打算正式发布了.
算一算, 从写下 maptalks 的第一行代码到现在, 已经在这个开源库上花了 4 年时间.
我是个自由职业者, 4 年前因为接了个地图外包项目, 因缘际会开始自己造轮子写引擎, 没想到一写就是 4 年 : P
项目地址是:
https://github.com/maptalks/maptalks.js
项目是一个 HTML5 的地图引擎, 基于原生 ES6 Javascript 开发:
- 二三维一体化地图, 通过二维地图的旋转 /倾斜增加三维视角
- 插件化设计, 能与其他图形库结合, 开发各种二三维效果, 例如 echarts/d3/THREE 等
- 很认真的优化了绘制性能
- 很重视测试, 有接近 1.5K 个单元测试用例, 所以稳定性还不错, 已经应用在很多大大小小的系统上了
以下是一段 maptalks 的 HELLO WORLD:
const map = new maptalks.Map('map', { center: [0, 0], zoom: 3, attribution: { content: '© <a href="http://osm.org">OpenStreetMap</a> contributors' }, baseLayer: new maptalks.TileLayer('base', { 'urlTemplate' : 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', 'subdomains' : ['a','b','c'] }) }); 我的目标是把它做成世界上最好的开源地图引擎产品 : ), 目前主要竞争对手有leafletjs和openlayers.
回想开发 maptalks 的过程还是挺唏嘘的, 掉进过一个又一个坑, 不得不一次又一次的重写重构, 总算熬到了现在. 即将发布, 丑媳妇要见公婆, 心情很忐忑 : P
都说 V2EX 是个做第一次分享的好地方, 看官们都很友善, 所以首先发在这里, 请大家提提意见, 不吝赐教.
另外, 既然是开源软件, 如果有同学感兴趣, 想参与开发的, 请随时联系我(fuzhen at maptalks.org)
最后按惯例求个 STAR~
 | 1 lyog 2017-10-12 22:35:10 +08:00 via Android  1 厉害，已 star |
| 2 lyog 2017-10-12 22:42:14 +08:00 via Android 不过我觉得楼主缺一个美工，还有，百度底图挂掉了 |
 | 3 megachweng 2017-10-12 22:45:27 +08:00 via iPhone 感谢分享 |
 | 4 fuzhenn OP |
 | 5 fo2w 2017-10-12 22:55:29 +08:00 1 好想把 lz 吸收进团队, 就是不知道有没有结束自由工作的想法... |
 | 6 AlwaysBee 2017-10-12 23:08:59 +08:00 太厉害了 |
 | 7 tvallday 2017-10-12 23:26:18 +08:00 4 年这么长时间？怎么熬过来的？地图引擎需要很多算法优化的，如果真能实际应用那是相当厉害。楼主有没有对比过 Mapbox ？这个公司很多高手。 |
| 8 fuzhenn OP 1 @tvallday 是的! mapbox 很多大神, 它目前是开源 GIS 领域里冉冉升起的新星, 这样的大腿不得不抱, 所以我在 maptalks 里采用了不少 mapbox 的样式标准和数据规范(可以在 maptalks.js 的 github 里搜索 mapbox) 我给 maptalks 主要定位于政府 /企业项目开发, mapbox 更偏服务(类似谷歌地图, 百度地图), 所以两者在定位上是互补的, 我也专门开发了 mapbox-gl-js 插件用来调用他们的服务( https://github.com/maptalks/maptalks.mapboxgl). |
 | 9 jjplay 2017-10-13 00:02:13 +08:00 很棒，会火！ |
 | 10 ashong 2017-10-13 01:05:21 +08:00 确实不错， 顶上去 |
| 11 ashong 2017-10-13 01:14:09 +08:00 没看到用的什么数据， 如何自定义数据？ |
| 12 ashong 2017-10-13 01:16:21 +08:00 不好意思， 看到了用的是 carto |
 | 13 stzz 2017-10-13 09:03:26 +08:00 自由工作,很强 |
 | 14 sliwey 2017-10-13 09:19:59 +08:00 膜拜大佬！已 star~ |
 | 15 Rico 2017-10-13 09:38:18 +08:00 必须赞！作为 GISer 的我觉得楼主功力深厚，能实现媲美 OpenLayers3 和 ArcGIS For Javascript API 的库，厉害！ |
| 16 Rico 2017-10-13 09:51:20 +08:00 简单看了一下，好像矢量切片没有？另外有个想法，如果做个 MapTalk 的 React 组件库会降低使用门槛，有更多的人使用。愿意一起搞,如果楼主也有这个想法可以联系我。另外楼主不是科班 GIS 能做出这个真心厉害！ |
 | 17 run2 2017-10-13 09:57:17 +08:00 厉害，（外行）要做个本地数据 室内地图（+路径导航？）的话 请问需要哪些 API 可以完成 谢谢 |
| 18 fuzhenn OP @Rico 哈哈, 来一起玩, 发个邮件给我吧(邮箱见正文最后). 你有啥想法都可以噢, 我会给你发 pull request~ 对了, 矢量切片的库正在开发, 开发好了会做成个插件开源出来. |
| 19 fuzhenn OP 2 @sobigfish 这个问题比较复杂, 哈哈, 涉及到前端地图渲染, 数据处理和导航算法 maptalks 只是前端地图渲染, 没有路径导航功能, 渲染室内地图是可以的, 晚点我去 examples 里增加一个室内地图的例子 po 回来. 不知道你的项目是 pc 端还是移动端的, 路径导航可以看看这个库: https://github.com/anvaka/ngraph.path 前几天刚在 twitter 上看到的, 蛮惊艳的 |
 | 20 droiz 2017-10-13 10:44:48 +08:00 滋瓷！！！ /td> |
 | 21 Phariel 2017-10-13 10:55:54 +08:00 吼啊！滋瓷！已 Star ！ |
| 22 Rico 2017-10-13 11:34:58 +08:00 1 @fuzhenn OK ! @sobigfish 如果是 OL3 可以 配合 AStar 算法或 Dijkstra 算出路径加上静态图片加载就可以实现了 http://openlayers.org/en/latest/examples/static-image.html。 |
 | 23 songjiaxin2008 2017-10-13 11:44:30 +08:00 牛逼 |
 | 24 gooin 2017-10-13 11:59:47 +08:00 支持支持，已 star |
 | 25 ctsed 2017-10-13 12:29:20 +08:00 via Android dalao 支持热力图吗 |
 | 26 xcold 2017-10-13 12:59:38 +08:00 已支持~ |
 | 27 puppychen 2017-10-13 13:05:10 +08:00 giser 表示支持，已 star。 |
| 28 fuzhenn OP |
 | 29 lblt102 2017-10-13 14:03:33 +08:00 支持一下 |
 | 30 xwhxbg 2017-10-13 14:38:28 +08:00 nice，支持一波 |
 | 31 wangxiaoer 2017-10-13 14:49:48 +08:00 via Android 最大的竟争对手是 leaflet open layers ？ 你把 Mapbox 置于何地 |
| 32 fuzhenn OP @wangxiaoer 不敢和大佬(mapbox)竞争, 哈哈. maptalks 的定位和 mapbox 差异还是蛮大的, 基本上用 mapbox 的不会考虑别的库. 但很多项目也不会考虑用 mapbox |
 | 33 zado 2017-10-13 16:33:24 +08:00 太好了，有中文文档，这个我必须要支持！ |
 | 34 ggbond1989 2017-10-13 18:00:41 +08:00 官网全英文的，很国际化啊，支持~ |
 | 35 xieguanglei 2017-10-13 18:16:44 +08:00 1 厉害了，大佬！ 冒昧地问下，有考虑结束自由职业生涯吗？如果有的话，有考虑来阿里吗？如果有考虑的话，能否跟我联系呢（因为没有找到你的邮箱，貌似 V2 没法发私信）？ 我的邮箱是 xieguanglei#hotmail.com 。如果无意的话，请无视我吧！冒昧了！ |
| 36 fuzhenn OP 1 @xieguanglei 谢谢谢谢, 我的邮箱是 fuzhen#maptalks.org, 不过我已经散漫惯了, 暂时没有计划结束自由职业的生活 : P |
 | 37 weloveayaka 2017-10-13 19:41:45 +08:00 2 有没有 donate 渠道？ |
 | 38 imn1 2017-10-13 20:35:10 +08:00 五体投地 |
 | 39 dyxang 2017-10-13 20:54:30 +08:00 via Android 有没有 demo ？ |
| 40 fuzhenn OP |
 | 41 cisisustring 2017-10-13 22:24:36 +08:00 via Android 太牛了，点赞 |
 | 42 df4VW 2017-10-13 23:30:52 +08:00 @xieguanglei 难得有会说话的阿里 hr.. |
| 43 xieguanglei 2017-10-14 06:51:48 +08:00 @df4VW 然而不是 HR。。。 |
 | 44 rswl 2017-10-14 17:28:30 +08:00 太强了 速度也快 |
 | 45 dd0754 2017-10-14 23:00:26 +08:00 膜拜大佬... |
| 46 fuzhenn OP 1 @sobigfish 做了个足球场的例子, 室内地图做起来大致同理, 供参考~ https://maptalks.org/examples/cn/tilelayer-projection/identity/#tilelayer-projection_identity |
 | 47 HelloAmadeus 2017-10-17 11:32:04 +08:00 太厉害了，star 关注一下 |
 | 48 SparkWong 2017-10-18 14:15:36 +08:00 来给 zhen 神捧个场~ |
| 49 fuzhenn OP 哈哈, 因为这篇贴, maptalks 被顶到了 github trending 总榜, 特地回来感谢一下 V2EX 的同学们! |
 | 50 spring5413 2017-10-20 19:03:21 +08:00 好厉害 已 star |
| 51 fuzhenn OP |
 | 52 1847bell 2017-10-24 10:31:17 +08:00 非常喜欢！已 Star |
 | 53 wucancc 2017-10-24 13:56:33 +08:00 已 star，非常厉害。 作为 GIS 从业者只能膜拜了。 不过开源项目，怎么才能让政府把经费支出呢，不支出怎么才能申请更多经费呢，哈哈哈，开个玩笑。 还没有细致研究，不知道地图样式这里是怎么处理的。 请问后台数据服务楼主用的是什么呢？除了 GeoServer，楼主有没有推荐呢。 赞楼主！楼主可以组建战队搞个大新闻了，哈哈。 |
 | 54 fuermosi777 2017-10-25 06:23:02 +08:00 人才 |
 | 55 a6377508 2017-10-25 13:00:40 +08:00 膜拜 |
| 56 fuzhenn OP @1847bell @fuermosi777 @a6377508 谢谢! @wucancc 感谢同行! 对于经费, maptalks 不会用来盈利的, 哈哈, 只是希望获得更多同行的认可. 关于后台数据服务, 我们用的是自己开发的服务软件, 类似 geoserver, 但会追踪一些比较新的技术, 比如矢量瓦片等等. |
| 57 wucancc 2017-10-27 09:24:11 +08:00 @fuzhenn “自己开发的服务软件”，OMG，看来是要搞个大新闻啊。赞！ 作为 GIS 小作坊，目前的巨量数据用 GeoServer 有点无法满足需求了，用主流商业公司产品又太贵。在苦苦寻找中。 期待楼主大作！ |
 | 59 dangyuluo 2017-10-29 11:29:59 +08:00 非常欣赏，无论是作品还是这种生活。 |
 | 60 fiht 2017-10-29 17:42:09 +08:00 给楼主赞一个，示例十分详细 |
 | 61 NullPoint 2017-11-02 09:24:37 +08:00 via Android 给楼主赞一个 |
 | 63 aleung 2017-11-18 11:22:11 +08:00 不错的项目！ 这两天尝试将一个原来用 leaflet 的工具移植到 maptalks，发现文档上还是有些不够理想的地方： * API document 的描述不够详细，特别是 options 的 type 只是 Object，不知道里面可以放什么，允许取值是什么 * Class 的方法、属性列表没有排序，找起来很费劲 Example 比较丰富，一定程度对 API 文档是补充，文档没有描述的就靠样例来猜了。 大部分 API 组织形式跟 leaflet 很类似，但又都有一点不一样，改起来好费劲啊，想放弃了。（当然这不算 maptalks 缺点） |
 | 64 bbsfoo 2017-11-23 01:08:10 +08:00 能不能加载百度地图？ |
 | 65 fuzhenn OP |
| 66 fuzhenn OP @aleung 谢谢建议！ Class 的方法和属性是按照在源代码中的定义顺序组织的， 我再收集一下其他用户的意见，如果大家都觉得按字母排序更好，我就改成按首字母来排序。 关于构造函数的 options 里的设置和取值范围，文档中其实是有的，但定义在了累的 options 成员属性上的，比如[Map.#options]( https://maptalks.org/maptalks.js/api/0.x/Map.html#options), 不过你说的确实有道理，还是挪到构造函数的参数列表里更直观一些，我晚点会改一下。 以后欢迎在新项目里使用 maptalks，随时来提 ISSUE 和 PR，参与 maptalks 的开发 ^___^ |
| 68 fuzhenn OP |
 | 69 openlayers3 2018-01-18 13:07:32 +08:00 @fuzhenn 支持 WMTS 吗？ |
| 70 fuzhenn OP |
 | 71 wzw 2018-04-08 12:05:24 +08:00 想知道 能不能 弄一个 wgs84 坐标的地图呀 |
 | 72 lewhonly 2018-04-11 11:03:54 +08:00 大神，你好，能不能请教个问题，threejs 加载法国的三维建筑模型，我看您也是一个 mesh 一个 mesh 的加载的，为什么 FPS 这么高，能达到 60，我用 geometry.merge 方法才只能达到 40，求大神指导 |
| 73 fuzhenn OP @wzw 如果你是指基于 wgs84 坐标的 4326 投影地图，示例在这里： http://maptalks.org/examples/cn/tilelayer-projection/epsg4326/#tilelayer-projection_epsg4326 |
| 74 fuzhenn OP @lewhonly 你是说 maptalks 的[three 插件]( https://github.com/maptalks/maptalks.three)吗？还是[biglayer 插件]( https://github.com/maptalks/maptalks.biglayer)? biglayer 是基于 webgl 原生写的，在性能上是做了一些优化。 至于为啥你自己的 three 程序速度会比较慢，你可以用 chrome 的 profile 工具，看看性能瓶颈在哪里 |
| 75 fuzhenn OP 呃，刚想起来 V2EX 不支持 md，上面提到的两个 maptalks 插件地址如下： https://github.com/maptalks/maptalks.three https://github.com/maptalks/maptalks.biglayer |
 | 76 cuipeng 2018-05-30 11:39:25 +08:00 可以作为 leaflet 的一款渐进式 3d 地图框架来用～ |
| 77 cuipeng 2018-05-30 11:49:53 +08:00 一个优化点，地图倾斜的时候 viewport 不会自动延展，而是基于原来屏幕的区域，边缘会虚化处理。最好跟 mapbox gl 一样，效果比较好 |
| 78 fuzhenn OP @cuipeng 感谢你的回复！ 边缘虚化范围是可以配置的，maptalks 中可以通过 maxVisualPitch 来调整虚化的角度，把它设成和 maxPitch 一样时，就和 mapbox-gl-js 一样的了。 默认情况下 maxVisualPitch 是 60，maxPitch 是 80，主要是因为 maptalks 的最大倾斜角度比 mapbox-gl-js 更大(目前最大到 60 度），角度很大时会有瓦片载入量过大的问题，为了优化性能，maptalks 有个很独特的 cascadeTile 优化功能，就是远处的瓦片改用上一级的，可以在保证视觉效果的前提下，有效减少瓦片数量（能够减少 50%） |
Select Language