Cesium Viewer is loading incorrectly

1. A concise explanation of the problem you're experiencing.
My WebApp is not working properly and I believe it is due to a weird loading of Cesium Viewer. The Cesium /Bing logo is not shown correctly (it is in the bottom middle of the page). The LayerGraphic choice in the top right has its picture not centered. I have another application running just fine, but for some reason this is tripping me up.

2. A minimal code example. If you've found a bug, this helps us reproduce and repair it.

var app = (function () {
    var viewer = {};

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

    var _addSatellite = function () {
        var dataObj = {
            sscNumber: $('#sscNumber').val()

        var options = {
            url: ‘http://localhost:59252/api/Sgp4/GetSCC’,
            data: dataObj,
            success: addCzmlDataSource,
            dataType: ‘json’


    function addCzmlDataSource(data) {
        var czmlDataSource = Cesium.CzmlDataSource.load(data);

    return {
        initCesium: _initCesium,
        addSatellite: _addSatellite


3. Context. Why do you need to do this? We might know a better way to accomplish your goal.
I am working on Cesium Web Development.

4. The Cesium version you're using, your operating system and browser.
Cesium 1.38 / Windows 10 / Google Chrome


Looks like you are loading the Viewer correctly. Do you have a minimal example with just getting the viewer running in your app perhaps? Also hoe are you defining the Cesium object here? Are you defining it via a script tag?



The problem was solved by putting the <img …> in a separate div with an ID.

Thanks for your help though!



Glad you got it figured out regardless. Thanks for the update!