bugfix> javascript > 投稿

こんにちは、Cesium Viewer/Mapにツールバーをオーバーレイしようとしていますが、sandcastleの例のようにdiv class = toolbarを実行しようとすると、ボタンや追加したものが常にマップの下に表示されます。私はこのようなものが欲しい:http://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>

回答 1 件
  • 修正は、ツールバーファイルを宣言するためにHTMLファイル内にスタイルタグを明示的に追加することでした

    #cesiumContainer {
                width: 100%;
                height: 100%;
                margin: 0;
                padding: 0;
                overflow: hidden;
            }
            .toolbar-left {
                display: block;
                position: absolute;
                top: 5px;
                left: 5px;
            }
    
    

あなたの答え