腾讯地图api_让数据和城市一样鲜活!腾讯位置服务数据可视化API来啦丨城市数据派...

2389ba0425e1f26b41d70149b61e90a9.png
d4cdef56213f5406c00eafe35bc5ba10.png

在这个大数据时代,各式各样纷繁复杂的海量数据让我们应接不暇。如何快速发现数据背后的规律,发掘数据隐藏的价值,是帮助我们提高业务决策效率的关键。在这个过程中,数据可视化将起到不可替代的作用。

尤其是带有空间属性的数据,和地图具有天然的匹配性。所以,让海量的位置数据通过一定的视觉形态在地图上进行直观的呈现,成为很多开发者们竞相考虑的选择。

c8793cd578b0ede317fcca0dc2b77855.png

经过长达一年的持续打磨和场景验证,我们正式面向开发者推出腾讯位置服务数据可视化API —— 基于腾讯位置服务JavaScript API GL (https://lbs.qq.com/webApi/javascriptGL/glGuide/glOverview)实现的专业地理空间数据可视化web渲染引擎,帮助开发者快速便捷的搭建适合自己业务的数据可视化场景。

e938ee6dc842671ccd37cc3c7a2aa07d.png

丰富样式,让数据与场景更匹配 我们的可视化API提供了热力图、散点图、轨迹图、弧线图、区域图等多种可视化样式。无论你的业务场景是何种类型,都能找到最合适的可视化样式进行呈现,实现数据和场景的天然结合。 当我们需要了解整个城市的实时人流分布的时候,城市热力图就是一个很好的呈现选择。

10f63e18afe4a69b24334c64e5cdf9f2.gif

城市实时热力

当我们需要了解整个城市内车辆的运行状态时,我们可以通过动态轨迹图来表现,直观的获知到城市内车辆的流动规律。

e5430e25cf795ad734d070a959a49a2d.gif

城市车辆流动规律分析

而当某个全国性事件发生,需要我们去关注各行政区划内该事件发展的程度时,这个时候我们可以利用到区域面填充的能力,帮助我们快速构建起事件地图。

390d3c6314f9eeffe992e8489bdec993.gif

全国事件地图

f11edd4030652ebd6e3cd382842196e5.png

鲜活呈现,让数据动起来 除了基础的点、线、面以及热力的静态绘制之外,我们的可视化API还提供了图形的动效显示能力,在让数据呈现更鲜活的同时,还增加了数据内涵的表达维度。例如在迁徙场景中,不仅可以通过弧线的粗细表现人口迁徙的量级,还可以通过弧线的动态流向,来表现人口迁徙的方向;在交通轨迹场景中,不仅可以通过线条的颜色表现车流的多少,还可以通过线条的运动方向,来表现车流的方向。

我们的可视化API自带这个动态效果,无需开发者额外开发。

93f80cff4bfdb9f2bee429f969f174e5.gif

弧线流向图

e14bcaa6d8d368e4765794a8c483f2c3.gif

动态轨迹图

fefa70d99d54514088931363bce279e1.png

性能保障,海量数据渲染

我们不只是追求视觉效果和简单易用,我们还要保证高性能。充分发挥GPU的并行计算能力,同时结合实例化渲染技术,大幅度提升了大数据量的渲染性能。最高支持百万级点、线、面绘制,同时可以保持高帧率运行。

4f30f335e1e6d6db1197cf6ef0667320.gif

Canvas2D可视化组件散点图-20万数据

86db71876ce807a7acbf55149c52a0a1.gif

数据可视化API散点图-20万数据 最大承载数据量对比(i7独显):
Canvas2D可视化组件数据可视化API
散点图250,0005000,000
热力图20,000160,000

弧线图

(动画)

300

120,000

弧线图

(无动画)

20,000120,000
区域图3,0005,000
轨迹图60,000
914a74c3e3e0dde83542021e6ea330de.png

简单易用,只需三步接入

在注册成为腾讯位置服务开发者并申请好KEY之后,只需3步,即可完成一个可视化场景的渲染:

1、 创建地图实例

var map = new TMap.Map('mapContainer', {    zoom: 4,    center: new TMap.LatLng(39.92659, 116.39806),    mapStyleId: "style3"});
2、 创建可视化图层

各图层已内置默认样式,所以只需指定地图对象即可完成创建,以散点图为例:

var dot = new TMap.visualization.Dot().addTo(map);

3、 传入数据

各图层数据格式不同,以散点图为例:

dot.setData([    { lat: 16.831090, lng: 112.338170 },    { lat: 41.878477, lng: 85.646478 },    { lat: 44.776380, lng: 82.483990 },    // 其他点省略]);

至此即可完成散点图的渲染了:

054b2ea01dffdceae50c9bcf615a66d9.png accafc1109d528dcb39286ff384bb86b.png 目前,腾讯位置服务数据可视化API已经服务于腾讯内部各大业务,经历了多个重要项目场景的验证,成熟度和稳定性都达到了新的水平。我们希望可以将这些优秀的能力开放给越来越多的开发者,满足开发者在可视化呈现上的更多诉求。 欢迎广大开发者立即访问腾讯位置服务官网: https://lbs.qq.com/webApi/visualizationApi/visualizationGuide/visualizationOverview, 获取关于数据可视化API的操作指南和更多示例,尽快开启你的可视化之旅!

 商务合作 

商业 投稿、商务 合作等,请联系客服微信号,加好友必须备注:合作+姓名 7c71775dc72f3bbb9bf1cbe80bc06c0f.png

 更多服务 

32b3973df4fa809e087a80120e2bd3f6.png 718ad55b0946f1229a5df6c39370b3a5.png a4e3e6be7ed195b295918fcf47ee3c46.png 2389ba0425e1f26b41d70149b61e90a9.png

48fc6ad67c4e4043c373295ad4a5a016.png

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值