mapbox

Add blur effect on a Mapbox

南楼画角 提交于 2019-12-03 15:47:43
I want to add blur effect in mapbox.when first time load map that time only display current location in map other map is blue.see screenshot when i move the userlocation to another location than other location is clear on the map.also display annotation in specific location see screenshot help me how can implement this here i will some implement code - (CGPoint)convertLatLongCoord:(CGPoint)latLong { CGSize screenSize = [UIScreen mainScreen].applicationFrame.size]; CGFloat SCALE = MIN(screenSize.width, screenSize.height) / (2.0 * EARTH_RADIUS); CGFloat OFFSET = MIN(screenSize.width, screenSize

说好不哭!数据可视化深度干货,前端开发下一个涨薪点在这里~

天大地大妈咪最大 提交于 2019-12-03 13:18:10
随着互联网在各行各业的影响不断深入,数据规模越来越大,各企业也越来越重视数据的价值。作为一家专业的数据智能公司,个推从消息推送服务起家,经过多年的持续耕耘,积累沉淀了海量数据,在数据可视化领域也开展了深入的探索和实践。 个推的数据可视化探索和应用由需求出发,从基于开源平台到结合个性化需求进行定制化开发,打造出个推实时消息推送下发图,人群分布热力图等优秀数据可视化作品。这一过程中,个推积累沉淀了大量的数据可视化组件,打磨了自己的数据可视化技术能力。其中,个推热力图正应用在智慧城市、人口空间规划、公共服务等领域,为其提供强大的数据支撑。 个推消息下发图 个推打造的湖滨商圈区域人口热力图 本文就和大家分享一下个推的数据可视化实践、遇到的问题及解决思路,希望大家能从中有所受益。 一、数据可视化的构成 数据可视化由四类可视化元素构成:背景信息、标尺、坐标系、视觉暗示。 1.1 背景信息 背景信息就是标题、度量单位、注释等附加类的信息。主要是为了帮助大屏受众更好地理解相关背景信息,即5W信息:何人(who)、何事(what)、何时(when)、何地(where)、为何(why)。 1.2 标尺 标尺主要用来衡量不同方向和维度上的数据大小,常用的有数字标尺、分类标尺、时间标尺等,类似我们熟悉的刻度。 1.3 坐标系 坐标系有一个结构化的空间,还有指定图形和颜色画在哪里的规则,用于编码数据的时候

个推数据可视化之人群热力图、消息下发图前端开发实践

和自甴很熟 提交于 2019-12-03 13:17:54
随着互联网在各行各业的影响不断深入,数据规模越来越大,各企业也越来越重视数据的价值。作为一家专业的数据智能公司,个推从消息推送服务起家,经过多年的持续耕耘,积累沉淀了海量数据,在数据可视化领域也开展了深入的探索和实践。 个推的数据可视化探索和应用由需求出发,从基于开源平台到结合个性化需求进行定制化开发,打造出个推实时消息推送下发图,人群分布热力图等优秀数据可视化作品。这一过程中,个推积累沉淀了大量的数据可视化组件,打磨了自己的数据可视化技术能力。其中,个推热力图正应用在智慧城市、人口空间规划、公共服务等领域,为其提供强大的数据支撑。 个推消息下发图 个推打造的湖滨商圈区域人口热力图 本文就和大家分享一下个推的数据可视化实践、遇到的问题及解决思路,希望大家能从中有所受益。 一、数据可视化的构成 数据可视化由四类可视化元素构成:背景信息、标尺、坐标系、视觉暗示。 1.1 背景信息 背景信息就是标题、度量单位、注释等附加类的信息。主要是为了帮助大屏受众更好地理解相关背景信息,即5W信息:何人(who)、何事(what)、何时(when)、何地(where)、为何(why)。 1.2 标尺 标尺主要用来衡量不同方向和维度上的数据大小,常用的有数字标尺、分类标尺、时间标尺等,类似我们熟悉的刻度。 1.3 坐标系 坐标系有一个结构化的空间,还有指定图形和颜色画在哪里的规则,用于编码数据的时候

Add custom map style to Mapbox.js

匿名 (未验证) 提交于 2019-12-03 09:05:37
可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效,请关闭广告屏蔽插件后再试): 问题: I just created my personal map style with Mapbox Studio and i'm try to use it with Mapbox.js. (NOT Mapbox Gl js!!) As written in the docu You can load and display styles from the API using Mapbox GL JS or the Mapbox Mobile SDKs or you can request styles directly from the API. This request requires an access token with the styles:read scope. I added on my < head > a link to: https://api.mapbox.com/styles/v1/myusername/mystyleid?access_token=mypublicaccesstoken I can see the JSON response but i still see basic map style. How can i use my

Offer packages of map tiles for offline use

不想你离开。 提交于 2019-12-03 08:43:03
I'm making a web application that has to work offline. So far everything works and my last step is to take the map tiles offline. Luckily I know exactly what areas of the map will need to be accessible to users, so I don't have to allow caching of millions of tiles. The map is split into areas and so the idea is to offer the tiles for these areas as downloadable 'packages.' For instance, when I'm online, I go to the 'tile packages' page, which offers downloads for several areas. I choose the area which I'm interested in, it downloads the tiles, and when I go offline, I'm able to use these

Offline tile caching using MapBox Android SDK

对着背影说爱祢 提交于 2019-12-03 08:39:00
I have a working iOS prototype using the iOS tile-caching technique as shown below (Objective-C code): RMTileCache * tileCache = [[RMTileCache alloc] initWithExpiryPeriod:0]; [tileCache setBackgroundCacheDelegate:self]; RMMapboxSource * tileSource = [[RMMapboxSource alloc] initWithMapID:mapID]; [tileCache beginBackgroundCacheForTileSource:tileSource southWest:southWest northEast:northEasth minZoom:minZoom maxZoom:maxZoom]; What this basically does is download the map, cache the tiles permanently and make it possible for the app to run offline in the future. Since we're going through the

Mapbox Typescript

不想你离开。 提交于 2019-12-03 07:18:33
I managed to get Leaflet working with Angular 2 and Webpack by following this project. angular 2 leaflet starter I can see the typings configured in "browser.d.ts": /// <reference path="browser\ambient\leaflet\leaflet.d.ts" /> webpack.config.js defines an entry point: ... entry: { 'polyfills': './src/polyfills.ts', 'libs': './src/libs.ts', 'main': './src/main.ts' }, ... The "libs.ts" contains the import of the Leaflet module: import 'leaflet'; I'm using Atom as a code editor. It now recognises all the Leaflet classes and methods. I can now do things like this in Angular 2: import {Map,

Mapbox GL JS: Export map to PNG or PDF?

血红的双手。 提交于 2019-12-03 05:05:38
I'm using Mapbox GL JS version 0.32. Is there a way to export the map to a high-res PNG or PDF? Obviously, I can just screenshot, but it would be nice if there was a more formal way. I found this repo , but it looks old and isn't clear how it works. I tried using the preserveDrawingBuffer option : var map = new mapboxgl.Map({ container: 'map', style: 'mapbox://styles/mapbox/light-v9', minZoom: 4, maxZoom: 14, center: [-2.0, 53.3], preserveDrawingBuffer: true }); console.log(map.getCanvas().toDataURL()); This outputs a long data URL in the console, but copying and pasting it into a base64

mapbox for unity 再现真实地图

孤街浪徒 提交于 2019-12-03 03:02:48
说到游戏中的真实地图,大家脑海中浮现的第一款游戏应该都是火爆全球的AR游戏《Pokémon Go》吧。今天这篇教程将为大家介绍Mapbox Unity SDK,能够在游戏中获取真实的世界地图,或是根据真实地图生成游戏中的体素世界。这些地图数据可以预先存储在游戏或应用中,也可以在运行时动态生成。 注册官网账号 打开mapbox官网( 传送门 )账号注册成功并登录后,点击Get Started 并选择Unity的sdk 记得复制下来它给你提供的密钥哦 导入unity 将下载的sdk导入unity,此时在菜单栏就会出现Mapbox选项 输入你的密钥后,我们就可以正式开始啦。 【如果Token生效,编辑器会出现“TokenValid”提示。】 注意:博主亲身体验的情况,在导入后,出现了在网上查询不到的报错; 代码中所有涉及到mesh的语句都报错了,博主到网上查了半天,因为有关的教程很少,也不知道是什么原因,如何有大神知道,麻烦留言告知我啦 反正我的解决方法简单粗暴,就是把报错的代码都注释掉了,神奇的是,对使用没有啥影响(至少现在我没看出来qwq) 示例场景 Mapbox插件提供了大量示例场景,其中最简单的示例场景Slippy,也是游戏项目较为常用的功能案例。它展示了地图从选中的某点开始不断向外延伸,根据视野范围的变化来实时加载新的地形,这也是游戏中追踪某个对象的真实地理位置时常用的功能。

Mapbox Typescript

匿名 (未验证) 提交于 2019-12-03 02:52:02
可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效,请关闭广告屏蔽插件后再试): 问题: I managed to get Leaflet working with Angular 2 and Webpack by following this project. angular 2 leaflet starter I can see the typings configured in "browser.d.ts": /// <reference path="browser\ambient\leaflet\leaflet.d.ts" /> webpack.config.js defines an entry point: ... entry: { 'polyfills': './src/polyfills.ts', 'libs': './src/libs.ts', 'main': './src/main.ts' }, ... The "libs.ts" contains the import of the Leaflet module: import 'leaflet'; I'm using Atom as a code editor. It now recognises all the Leaflet classes and methods. I can now