鉴于目前的HTML5规范,允许创建自定义HTML元素(只要他们的名称中包含一个破折号),而事实上,Web组件似乎是一个功能,在这里留下来,我想知道为什么是创建自己的自定义HTML元素不满意?
请注意,我不是在问是否使用Web组件 - 它仍然是一个移动目标,即使像Polymer这样的大型polyfill也可能尚未准备好进行生产.我问的是创建自己的自定义HTML标记并设置样式,而不需要附加任何JS API.
目标
我正在尝试构建一个应用程序,从而将整个世界地图分成大量的六边形。这些六边形一旦生成,将始终覆盖地图上的同一区域。然后,在给定特定地理坐标的情况下,如果这些坐标位于其边界内,则将在地图上绘制六边形。这些六边形必须非常小,每边大约为1。50m-这是主要问题。
第一次尝试
我的第一个想法是预先生成一个六边形网格,其中每个十六进制都将是不可见的,并且在确定坐标是否在边界内之后,只需更改六边形的样式即可。如果六角形边长确实很大(几百公里),则此方法有效。但是,就我而言,即使绘制较小的六边形,应用程序也将耗尽内存。
// Attempting to cover the whole map in small hexagons
turf.hexGrid([-179.99, -89.99, 179.99, 89.99], 0.2);
Run Code Online (Sandbox Code Playgroud)
第一次尝试,但要有所改变
我的第二个想法是使用的mask
选项hexGrid()
,这样我仍然会生成具有不变六边形坐标的十六进制网格,但只会尝试在较小的地图区域(例如,在地图上可见的区域)内渲染六边形。这似乎也不可能,因为即使生成这样的网格(也没有在地图上渲染)也证明会消耗太多资源。
// Attempting to cover the whole map in small hexagons only within a given area (mask)
turf.hexGrid([-179.99, -89.90, 178.99, 88.90], 30, {
mask: polygon([[[20, 60], [21, 60], [22, 62], [22, 63], [20, 60]]]),
});
Run Code Online (Sandbox Code Playgroud)
但是,这将产生非常偏斜的六边形,这使我相信尝试为整个世界生成十六进制网格通常不是一个好主意。
乐观计算
我的最后一次尝试是在地图的左上角生成一个六边形,并使用其坐标来计算该第一个六边形与任何给定坐标之间可容纳多少个六边形。
这些计算几乎可以正常工作,但是由于四舍五入或者可能是我在计算距离时(手动)的方式出现错误,因此坐标距离第一个六边形越远,定位的偏差就越大。
现实生活中 的示例与我想要实现的最接近的示例是在名为“ Run a Empire”的跑步游戏中。六角形网格似乎按需加载,并且仅围绕该区域位于该区域。从其外观看,该网格没有任何间隙,会阻止六边形完美连接。
另外,在世界地图上绘制六边形会使它们向北偏远。在上述游戏中(在下面的截图中)似乎没有发生这种情况。那是否意味着六边形的大小是硬编码的,或者它们是在不发生偏斜的不同地图投影上绘制的?
在给定地理坐标(如GPS位置)的情况下,如何可靠地生成六边形网格,以便在根据另一组坐标生成另一六边形网格时,这两个网格将完全重叠?我愿意解决任何工具,不一定要使用Turf或Mapbox。
Wordpress提供了一种使用XML导入和导出数据的简便方法.它是使用基于GUI的内置导入程序完成的.然而,我想要做的是能够从我的主题中导入某些XML文件(激活时或执行函数后).
我的情况:虽然有一些插件可以为你创建虚拟内容,但我找不到任何办法去做我想做的事情 - 导入一组存储在XML文件中的ACF字段.
有什么办法吗?
angularjs ×1
custom-tag ×1
html5 ×1
javascript ×1
mapbox ×1
maps ×1
turfjs ×1
wordpress ×1
xml ×1