Javascript Azure Maps仅在角落中渲染平铺

我正在我的一个辅助项目中使用Azure Maps S0，我正在尝试使其正确渲染。该示例运行良好，但我将该库作为一个小部件嵌入ThingWorx（side项目）

问题：平铺本身仅在我的div的左上角渲染，但缩放控件和Microsoft徽标渲染在正确的位置

如果我调整页面大小，我可以解决这个问题：这个操作会导致平铺正确地占据所有div

我使用的构造函数是：

map = new atlas.Map(id, {
                center: [-118.270293, 34.039737],
                view: 'Auto',
                showFeedbackLink: false,
                authOptions: {
                    authType: 'subscriptionKey',
                    subscriptionKey: redacted
                }
            });

我确保它绑定到的div在初始化构造函数之前和之后具有正确的clientHeight（489）和clientWidth（960）。 我尝试在调用构造函数后调用map.resize，但没有看到任何更改

看起来像个虫子，但我不是100%确定。你知道为什么这不符合我的预期吗

---

如果页面或地图div较小，然后变大，则底层HTML5画布/WebGL上下文可能没有注意到扩展（它们通常不会自动增长）。如果知道要进行扩展，可以调用

map.resize（）

，它应该重新计算可用区域并修改画布的大小。map已经尝试并监控了这一点，但是没有一个很好的方法可以做到这一点，因为在HTML/JavaScript中DOM元素上没有调整大小的事件。

谢谢rbrunditt。我还考虑了这个讨厌的画布，并尝试在构造函数之后执行map.resize（），但似乎没有解决这个问题。我将把调用添加到保证稍后执行的某个位置，并更新此线程。解决了它。这是一个虚拟的错误，与我的日志记录有关，事实上该对象的宽度和高度为0。在检查div特征时，我将整个对象记录到控制台中，它不是快照，而是一个引用，当您展开对象时会更新该引用。看看本文中的日志对象部分，实际的解决方案是在runtime.js中实现resize函数，并在那里调用map.resize。由于使用了画布上下文，我们不能依靠CSS来完成这项工作。