JavaScript 的 HERE 地图 API 中的道路标签图层
Road Label Layer in HERE Maps API for JavaScript
我正在尝试使用 HERE Maps API for JavaScript 将矢量图添加到网页。我一直在使用下面的样式代码来呈现类似于 the 4th picture from the top at this link(只有道路和水域图层的样式)的超极简样式。
sources:
omv:
type: OMV
max_zoom: 17
min_display_zoom: 1
# global description of the map, in this example
# the map background color is white
scene:
background:
color: [1.000, 1.000, 1.000, 1.00]
# section contains the style information for the layers
# that are present on the map
layers:
# user defined name of the rendering layer
water_areas:
# the section defines where the rendering layer takes
# its data from source: omv is mandatory for the Vector Tile API
# layer: water specifies what vector layer is taken
# for the rendering see REST API documentation for the
# list of available layers.
data: {source: omv, layer: water}
# section defines how to render the layer
draw:
polygons:
order: 1 # z-order of the layer
color: [0.055, 0.604, 0.914, 1.00]
road:
data: {source: omv, layer: roads}
draw:
lines:
order: 2
color: [0.561, 0.561, 0.561, 1.00]
width: 15
不难弄清楚如何添加 geoshape 叠加层和 UI 控件和平移等内容,但我未能成功添加的一件事是道路标签。 (这似乎很容易。)
我试图从其他文档示例中获取道路标签层的代码,但它总是会破坏地图(只在白色背景上留下我的地理形状)。这可能是因为始终有全局变量附加到标签的语言或填充颜色,但是当我尝试引入所有全局变量设置和引用时,地图仍然损坏。
所以我的问题是,有谁知道 simple/foolproof 将道路标签添加到具有这种最小样式的 HERE 地图的方法吗?我想我正在寻找使该层可见所需的最少属性。谢谢!
为了更好地修改(删除 section/add 你的)矢量样式以使用在线编辑器 Map Style editor(它允许你立即看到更改)然后在你的网站上加载修改后的样式 yaml 文件应用如:
function setStyle(map) {
// get the vector provider from the base layer
var provider = map.getBaseLayer().getProvider();
// Create the style object from the YAML configuration.
// First argument is the style path and the second is the base URL to use for
// resolving relative URLs in the style like textures, fonts.
// all referenced resources relative to the base path https://js.api.here.com/v3/3.1/styles/omv.
var style = new H.map.Style('URL/to/your.yaml',
'https://js.api.here.com/v3/3.1/styles/omv/');
// set the style on the existing layer
provider.setStyle(style);
}
请参阅 https://jsfiddle.net/qw64zL85/ 上的示例
将此 yaml 示例文件与 road_labels 一起使用:there only yaml text
我正在尝试使用 HERE Maps API for JavaScript 将矢量图添加到网页。我一直在使用下面的样式代码来呈现类似于 the 4th picture from the top at this link(只有道路和水域图层的样式)的超极简样式。
sources:
omv:
type: OMV
max_zoom: 17
min_display_zoom: 1
# global description of the map, in this example
# the map background color is white
scene:
background:
color: [1.000, 1.000, 1.000, 1.00]
# section contains the style information for the layers
# that are present on the map
layers:
# user defined name of the rendering layer
water_areas:
# the section defines where the rendering layer takes
# its data from source: omv is mandatory for the Vector Tile API
# layer: water specifies what vector layer is taken
# for the rendering see REST API documentation for the
# list of available layers.
data: {source: omv, layer: water}
# section defines how to render the layer
draw:
polygons:
order: 1 # z-order of the layer
color: [0.055, 0.604, 0.914, 1.00]
road:
data: {source: omv, layer: roads}
draw:
lines:
order: 2
color: [0.561, 0.561, 0.561, 1.00]
width: 15
不难弄清楚如何添加 geoshape 叠加层和 UI 控件和平移等内容,但我未能成功添加的一件事是道路标签。 (这似乎很容易。)
我试图从其他文档示例中获取道路标签层的代码,但它总是会破坏地图(只在白色背景上留下我的地理形状)。这可能是因为始终有全局变量附加到标签的语言或填充颜色,但是当我尝试引入所有全局变量设置和引用时,地图仍然损坏。
所以我的问题是,有谁知道 simple/foolproof 将道路标签添加到具有这种最小样式的 HERE 地图的方法吗?我想我正在寻找使该层可见所需的最少属性。谢谢!
为了更好地修改(删除 section/add 你的)矢量样式以使用在线编辑器 Map Style editor(它允许你立即看到更改)然后在你的网站上加载修改后的样式 yaml 文件应用如:
function setStyle(map) {
// get the vector provider from the base layer
var provider = map.getBaseLayer().getProvider();
// Create the style object from the YAML configuration.
// First argument is the style path and the second is the base URL to use for
// resolving relative URLs in the style like textures, fonts.
// all referenced resources relative to the base path https://js.api.here.com/v3/3.1/styles/omv.
var style = new H.map.Style('URL/to/your.yaml',
'https://js.api.here.com/v3/3.1/styles/omv/');
// set the style on the existing layer
provider.setStyle(style);
}
请参阅 https://jsfiddle.net/qw64zL85/ 上的示例 将此 yaml 示例文件与 road_labels 一起使用:there only yaml text