在地图上画正六边形时出现的问题(d3)
来源:互联网 发布:mac怎样整理文件 编辑:程序博客网 时间:2024/06/06 01:17
在一个项目里需要在地图上叠加正六边形图形进行分割。用的方法是d3给的方法。流程是:
(1)获取地图边框范围
(2)计算出铺满地图范围的所有六边形的中心点的坐标centers[];
(3)利用sin 与 cos函数计算出六边形六个顶点的坐标points[]
(4)添加geometry到图层
下面的代码包括了(1)(2)(3)部分。
可是运行结果,发现并不是正六边形。找了很久原因后发现,因为坐标系是经纬度的,当radius=0.005时,经度加0.005与纬度加0.005的实际距离(米)是不同的。
var extent = hexbin.Map.map.getExtent(); var xmin = extent.xmin, ymin = extent.ymin, xmax = extent.xmax, ymax = extent.ymax; var radius=0.005; //六边形边长 var dx = radius * 2.2 * Math.sin(Math.PI / 3);//分割的宽度var dy = radius * 1.5;//分割的高度 var centers = [];//中心点坐标集 var xnum = (xmax-xmin)/dx+1; var ynum = (ymax-ymin)/dy+1; for(var i=0;i<xnum;i++){ for(var j=0;j<ynum;j++){ var point = []; if(j%2 == 0){ point[0]=xmin+i*dx; point[1]=ymin+j*dy; }else{ point[0]=xmin+(i+0.5)*dx; point[1]=ymin+j*dy; } centers.push(point); } } var hexItem=[]; for(var a=0;a<centers.length;a++){ var angle = 0; var points=[]; for (var i = 0; i < 6; i++, angle += Math.PI / 3) { points.push([ centers[a][0]+ radius * Math.sin(angle), centers[a][1] + radius * Math.cos(angle) ]); }
然后大概估计了一个系数1.1,代码改为如下,之后运行,就近似正六边形了。
for (var i = 0; i < 6; i++, angle += Math.PI / 3) { points.push([ centers[a][0]+ radius * Math.sin(angle)*1.1, centers[a][1] + radius * Math.cos(angle) ]); }
阅读全文
0 0
- 在地图上画正六边形时出现的问题(d3)
- d3地图遇到的问题
- d3.js在坐标轴遇到的问题
- 使用百度地图时出现的问题
- D3添加title提示信息时出现滚动条时,显示错位的问题
- 基于二维数组的六边形地图数据结构的实现(蜂窝拓补)
- D3.js在svg地图上标点
- 如何使用 D3 在地图上实现实时画圈的效果
- d3.js学习9----地图的制作
- Android移动开发-通过自定义算法代码来纠偏地图由GPS定位到的经纬度在地图上显示或解析位置时出现偏移的问题
- 做ArcGis Query result on map例子时,出现查询窗口在地图下一层无法查询的问题
- 【d3.js实践教程特别篇】PornHub发布基于d3的网民观看成人视频时长分布交互式地图
- 19个整数在六边形中的排列问题
- 添加地图注记出现的问题
- 百度地图只出现网格的问题
- 升级之后百度地图出现的问题
- Django开发D3.js展示页面时IE浏览器d3 is undefined error问题的解决
- 【libgdx】2D地图块(tileset)地图出现缝隙(gap / bleeding)的问题
- 媒体报道 | 创业邦:巴别鸟,一款便捷好用的企业级文件协同网盘
- github vs gitlab 工作量统计
- 【jzoj5219】【GDOI2018模拟7.10】【B】【动态规划】
- 配置采购订单审批报错: Please check release classes (see long text)
- Android 使用数学函数(Math函数)
- 在地图上画正六边形时出现的问题(d3)
- ajax初级入门(案例演示)
- EffectiveC++学习笔记-条款26|27
- 【R的机器学习】Apriori算法
- PBR--光照模型的组成一
- 微信开发-苹果手机无法滑动页面
- Windows操作系统上安装LDAP Browser
- C语言(二):常量
- Android探索之旅(第二十三篇)AlarmManager定时任务