Наложение панели инструментов на Cesium Viewer / Map

Привет, я пытаюсь наложить панель инструментов на Cesium Viewer / Map, но всякий раз, когда я пытаюсь сделать панель инструментов div class =, как в примере с замком из песка, кнопки или что-либо, что я добавляю, всегда отображается под картой. Я хочу что-то вроде этого: https://i.imgur.com/KKI2W5R.png

Вот что у меня есть на данный момент:

Index.html

<html>
<head>
    <title>Demo</title>

</head>

<body>
     {% load staticfiles%}
     <script src= {% static "js/Cesium.js"  %} type="text/javascript"></script>
     <div id="cesiumContainer"></div>
     <div class="toolbar-left">
    <button onclick="alert('You clicked!');">Click me!</button>
    </div>
    {% load static %}
    <link rel="stylesheet" type="text/css" href="{% static 'test/hello.css' %}" />
     <script>
        var viewer = new Cesium.Viewer('cesiumContainer');
     </script>
</body> 
</html>

person Advait Kulkarni    schedule 25.05.2018    source источник


Ответы (1)


Исправление заключалось в том, чтобы явно добавить тег стиля внутри html файла, чтобы объявить панель инструментов слева.

#cesiumContainer {
            width: 100%;
            height: 100%;
            margin: 0;
            padding: 0;
            overflow: hidden;
        }

        .toolbar-left {
            display: block;
            position: absolute;
            top: 5px;
            left: 5px;
        }
person Advait Kulkarni    schedule 25.05.2018