Here api DOM标记的定位和旋转

Here api DOM标记的定位和旋转,here-api,Here Api,我可以在这里的MapAPI中将旋转设置为DOM标记的css。然而,我不能锚定。这将导致旋转的原点偏离标记的坐标。见下图: 如何解决 相关代码如下所示: 从'react dom/server'导入{renderToStaticMarkup}; 从“/utils”导入{PositionToLatLng}; 导出类标记{ 构造函数(映射、选项){ const{position,children,angle,…others}=选项; this.marker=新的H.map.DomMarker(位置)到

我可以在这里的MapAPI中将旋转设置为DOM标记的css。然而,我不能锚定。这将导致旋转的原点偏离标记的坐标。见下图:

如何解决

相关代码如下所示:

从'react dom/server'导入{renderToStaticMarkup};
从“/utils”导入{PositionToLatLng};
导出类标记{
构造函数(映射、选项){
const{position,children,angle,…others}=选项;
this.marker=新的H.map.DomMarker(位置)到地图(位置){
图标:新的H.map.DomIcon(renderToStaticMarkup(
{儿童}
)),
});
this.map=map;
this.map.addObject(this.marker);
}
删除(){
this.map.removeObject(this.marker);
}
}
它与“renderToStaticMarkup”一起使用。但如果我使用“renderToDiv”,它将不会呈现任何内容

从“react dom”导入ReactDOM;
导出函数renderToDiv(元素){
const content=document.createElement('div');
render(元素、内容);
返回内容;
}
我打印“renderToDiv”的返回值,如下所示:


锚参数仅适用于
H.map.Icon
。使用CSS样式将
H.map.DomIcon
居中放置

假设图标的宽度和高度为24px:

<div style="left: -12px; top: -12px;">
   // icon content
</div>

//图标内容

H.map.DomIcon()只能将字符串作为参数。我通过一个DomeElement,它什么也没有呈现。那么,如何通过HTML字符串获取iconWidth?如果它使用domeElement,我可以使用domeElement.offsetWidth.H.map.DomIcon可以使用domeElement:您应该添加与图标创建相关的代码。
const marker=new H.map.DomMarker(pos,{icon:new H.map.DomIcon(dom)})此代码不呈现任何内容。如果我把“dom”改为“string”,它就会起作用。真正的代码就在我的问题中发布了。请参见上面的内容。
renderToDiv
函数返回一个div为空的domeElement,因为
ReactDOM.render
返回的引用没有返回,并且假设您使用的元素不是无状态的,在这种情况下,
ReactDOM.render
返回null。但是,这超出了将锚点设置为
H.map.DomIcon
的范围,因此我建议您在react标签下打开一个问题,如果是这样的话,请将该问题标记为已回答。如果可能,可以。