我有一个我所在城市的数据库,其中包含一条街道的名称和一个代表平均人口密度的数字(从 1 到 5)。
我想在地图上表示这一点(不管是谷歌地图还是 OSM 或其他什么),我根据密度将街道从绿色变为红色。
问题我不知道如何给街道上色,甚至不知道如何在上面画一条折线。
有任何想法吗 ?
泰!
我有一个我所在城市的数据库,其中包含一条街道的名称和一个代表平均人口密度的数字(从 1 到 5)。
我想在地图上表示这一点(不管是谷歌地图还是 OSM 或其他什么),我根据密度将街道从绿色变为红色。
问题我不知道如何给街道上色,甚至不知道如何在上面画一条折线。
有任何想法吗 ?
泰!
如果您使用的是 Google 地图 APIv3,那么在地图上创建/绘制线条并不是一项艰巨的任务。Gmaps3 文档清楚地解释了使用它-
https://developers.google.com/maps/documentation/javascript/overlays#Polylines
逻辑是将您的街道坐标(latlng)传递给一个数组,该数组可用于在地图上绘制一条线。此外,您可以轻松更改折线的颜色。对于如何实现这一点的想法,您可以拥有一个包含一组颜色的数组,例如 -
var linecolors = [];
linecolors[0] = '#3333FF';
linecolors[1] = '#8A0808';
linecolors[2] = '#B45F04';
linecolors[3] = '#B18904';
然后根据密度值在创建折线时适当地从数组中获取颜色
更新:要查找街道坐标,您可能需要路线服务。
您可以将地址或位置作为起点和终点传递给directionsService.route()
并使用travelMode DRIVING
。你得到了街道 -示例
您可以使用 chrome 控制台-网络选项卡查看和存储接收到的坐标(您会找到下载的带有坐标的 js 文件)。