Изменить размер зрителя цезия

В настоящее время разрабатывает веб-приложение с использованием Cesium и Bootstrap.

Проблема в том, что просмотрщик цезия не может быть изменен. Единственное решение, которое я нашел, чтобы ограничить его до 50% окна overflow: hidden; в css. Вы поймете, что это может привести к ненужному использованию ресурсов, потому что мы делаем простой кеш-мизер.

Любой ключ, чтобы изменить размер зрителя цезия?

  var cesiumContainer = document.getElementById("cesiumContainer");

  var ellipsoid = Cesium.Ellipsoid.WGS84;

  var viewer = new Cesium.Viewer("cesiumContainer", {
    sceneMode: Cesium.SceneMode.SCENE3D,
    infoBox: false,
    geocoder: false,
    timeline: false,
    animation: false,
    homeButton: false,
    scene3DOnly: true,
    baseLayerPicker: false,
    sceneModePicker: false,
    fullscreenButton: false,
    projectionPicker: false,
    selectionIndicator: false,
    navigationHelpButton: false,
    navigationInstructionsInitiallyVisible: false
  });
html,
body,
#cesiumContainer {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!DOCTYPE html>
<html lang='en'>

  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <link rel="stylesheet" href="http://cesiumjs.org/releases/1.11/Build/Cesium/Widgets/widgets.css">

    <script src="http://cesiumjs.org/releases/1.11/Build/Cesium/Cesium.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

  </head>

  <body>

    <div class="container-fluid">
      <div id="cesiumContainer"></div>

      <div class="col">
        This must take 50% of height.
      </div>

    </div>

  </body>

</html>

1 ответ

Отзывчивые DIVs в CesiumViewer [CesiumJS]

Как я уже сказал здесь, где у меня очень похожая проблема, используя реактив, вы можете использовать цезий в качестве компонента реакции и визуализировать карту цезия и его размер в зависимости от размера браузера.

Другие вопросы по тегам