2014-11-05 55 views
1

我们有一个遗留网站,从中我们需要删除所有Google地图,并用MapBox提供的地图取代它们。所以我正处于一个崩溃项目的中间,以换取新的旧版本。当Telerik拆分器内部没有绘制所有拼贴图时,Mapbox并没有画出所有拼图

这里是我的问题:旧网站是用ASP.NET写的,大量使用Telerik的控件。在这个页面中,我们有一个RadSplitter和一个RadPane中绘制的Google地图。

使用MapBox地图转换Google地图非常简单,除了MapBox地图不能正确呈现。只有沿着窗格左边缘的瓷砖正在绘制。但是 - 当我调整浏览器窗口的大小时,其余的图块会绘制。

div的位置是绝对的,顶部,底部,右侧和左侧都设置为0.哪些Google地图可以使用。

我的猜测是Telerik正在做一些令MapBox渲染代码困扰div的实际大小的东西。而且,当窗口调整大小时,MapBox会重新评估事物,并将其正确。

我一直在玩弄这个了几个小时了,还是一无所获:

  • 我试着在代码触发resize事件,和瓷砖没有画。
  • 我试过将地图放在一个固定大小的div中,在窗格内,地图绘制到了边缘,然后div使用滚动条坐在窗格内,这证实了我对我的看法处理大小问题,但我不能有滚动条,所以
  • 我试着设置div的宽度和高度,以代码中窗格的大小,并没有触发地图画出缺失的窗格。

我用尽了想法。

MapBox渲染器上是否有一些事件或函数会导致它重绘浏览器调整大小时的方式?

+0

您是否尝试将宽度和高度设置为100%的div放置地图? RadPanes总是以像素为单位设置尺寸,所以这应该让它按预期调整尺寸。 此外,尝试切换VisibleDuringInit属性值,看看这是否有所作为 – rdmptn 2014-11-12 11:42:36

回答

0

所以地图正在绘制在假框架,这可能是摆脱计算的什么是“看得见” ...

你有共享的实际输出HTML的方法吗?像jsfiddle?

是否有任何控制台错误?也许这是简单的,因为你已经达到了地图瓷砖服务器的配额...

尝试不同的瓷砖服务器?

+0

我恐怕这是一个怪异的应用程序的一部分,有这么多的依赖于共享任何输出的一部分是不可行的。我们的目标是用容易维护的东西来替换整个事物(并且不使用ASP.NET),但是随后我们从高度受到这个任务的打击... – 2014-11-05 22:18:18

2

原来答案是很简单:

map.invalidateSize(); 

编辑 - 几天层

原来,只能在IE浏览器。在Chrome中,invalidateSize()不会导致地图正确调整自身大小。

+0

不错!很高兴我推荐的是部分问题,即使我没有解决方案。 – nrutas 2014-11-06 23:12:44

+0

map.invalidateSize()在map.fireEvent(“resize”)没有的时候为我们重绘地图。似乎在Chrome和IE(至少)中工作。 – 2015-06-02 13:52:41