gpt4 book ai didi

javascript - 更改 Bing map 元素中的 CSS?

转载 作者:太空宇宙 更新时间:2023-11-04 12:15:49 25 4
gpt4 key购买 nike

我正在将内部应用程序从使用 Google map 转换为使用 Bing map 。 map 需要出现在命名的 HTML div 中。在我转换它们的所有地方,它们都呈现良好,只有一个异常(exception)。

map 应该出现在一张很长的 table 的底部。相反,它呈现在页面顶部,覆盖多行。使用 F12 开发人员工具(在 IE 中),我们能够调整一些 CSS 参数以使其正确呈现。问题是,它们在 Bing map 插入的 divs 中。查看 Microsoft Maps API,可以更改许多选项,但不能更改 Bing 生成的 CSS。

相关的CSS:

<div class="MicrosoftMap MapTypeId_auto large miniscule" style="left: 0px; top: 0px; 
right: 0px; bottom: 0px; overflow: hidden; position: relative; z-index: 0;
cursor: url(http://ecn.dev.virtualearth.net/mapcontrol/v7.0/7.0.20141118162111.86/cursors/grab.cur), move;
direction: ltr !important; touch-action: none; background-color: rgb(244, 242, 238);">

如果我们移除overflow,那么:

<div class="MicrosoftMap MapTypeId_auto large miniscule" style="left: 0px; top: 0px; 
right: 0px; bottom: 0px; position: relative; z-index: 0;
cursor: url(http://ecn.dev.virtualearth.net/mapcontrol/v7.0/7.0.20141118162111.86/cursors/grab.cur), move;
direction: ltr !important; touch-action: none; background-color: rgb(244, 242, 238);">

它在正确的位置正确呈现。分配 map 的代码:

var newMap = new Microsoft.Maps.Map(
document.getElementById("mapelement"), {
credentials: "[my credentials]",
center: new Microsoft.Maps.Location(37.6970, -97.8096),
disableBirdseye: true,
mapTypeId: Microsoft.Maps.MapTypeId.road
});

插入 map 的函数 LoadMaps() 在 HTML 中被调用:

<body onload="LoadMaps()">

我们没有使用 jQuery 或任何其他库。

我的主要理论是,Bing map 会在加载 mapelement 之前尝试呈现,因此它只会呈现在顶部。但这并不能解释为什么 Google map 可以很好地呈现到元素中,并且 onload 应该只在整个页面加载后调用。

还有其他人使用过 Bing map 并且可能知道发生了什么事吗?

更新:这是 map 元素的 HTML:

<table class="tableResult" border="0">
<tr>
<td class="mapCell"><div id="mapelement" style="width: 900px; height: 900px"></div></td>
</tr>
</table><table border="0">
<tr>
<td colspan="29"><p style="page-break-before: always"></td>
</tr>
</table>
</div>

我知道 hte div 在表格内部开始时在表格外部关闭是很奇怪的,但这不是问题所在(因为它是一个 aspx 页面,所以改变它有点痛苦)。

最佳答案

您需要为 map 指定一个位置值。在样式参数中添加position:relative;

关于javascript - 更改 Bing map 元素中的 CSS?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28723689/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com