Как правильно встроить цезий в элемент сетки - PullRequest
Новая
       16

Как правильно встроить цезий в элемент сетки

1 голос
/ 20 марта 2019

Я пытаюсь контролировать свой контейнерный элемент Cesium с помощью CSS Grid. Но в Edge кажется, что он автоматически проезжает мимо Земли, если она находится в сетке. Это, кажется, не происходит, если я использую Chrome или даже IE. Что именно происходит и как с этим бороться? Основной код используется ниже. Можно использовать https://codepen.io/rachelandrew/pen/XdZydB для подключения:

CSS: 

body {
  margin: 40px;
}
.wrapper {
        display: grid;
    grid-gap: 10px;
        grid-template-columns: repeat(auto-fill, [col] 100% ) ;
        grid-template-rows: repeat(auto-fill, [row] auto  );
        background-color: #fff;
        color: #444;
    }
    .box {
        background-color: #444;
        color: #fff;
        border-radius: 5px;
        padding: 20px;
        font-size: 150%;

    }

    .a {
        grid-column: col / span 2;
        grid-row: row ;
    }

HTML: 

<div class="wrapper">
  <div id="cesiumContainer" class="box a">A</div>
</div>
  <script src="https://cesiumjs.org/releases/1.55/Build/Cesium/Cesium.js"></script>
  <link href="https://cesiumjs.org/releases/1.55/Build/Cesium/Widgets/widgets.css" rel="stylesheet">

JS: 

var viewer = new Cesium.Viewer('cesiumContainer');

РЕДАКТИРОВАТЬ: Сначала я не заметил, но у меня было переполнение скрыто. Удаление этого показывает, что Edge, кажется, навсегда увеличивает размер элемента при использовании цезия. Я думаю, что это как-то связано с 

        grid-template-columns: repeat(auto-fill, [col] 100% ) ;

РЕДАКТИРОВАТЬ 2: Я закончил тем, что бросил решетку для моей работы, связанной с Цезием. Я никогда не находил решения с использованием технологии сетки. Вместо этого я реализовал гибкие группы, которые, похоже, не влияют на рендеринг одинаково. Я сохранил копию своей другой структуры в надежде, что я наткнусь на решение, если я сделаю это, я опубликую официальный ответ, если кто-то не превзойдет меня в этом.

...