1

ここに画像の説明を入力地球にラベルを付けるコードを取得しました。問題は、ローカル サーバーで実行しようとすると、404 エラーと不明な参照エラーが発生することです。コードは次のとおりです。

<html>
<head>
<style>
    @import url(bucket.css);
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"       type="text/javascript"></script> 
<script src="require.js" data-main="main"></script>
</head>
<body>
<div id="cesiumContainer" class="fullSize"></div>
<div id="loadingOverlay"><h1>Loading...</h1></div>
<div id="toolbar"></div>
<script>
require(['Cesium', 'Button'], function(Cesium, Button)
{
    "use strict";

    function addLabel(scene, ellipsoid) {
        Sandcastle.declare(addLabel);   // For highlighting in Sandcastle.
        var labels = new Cesium.LabelCollection();
        labels.add({
            position : ellipsoid.cartographicToCartesian(Cesium.Cartographic.fromDegrees(-75.10, 39.57)),
            text     : 'Philadelphia'
        });
        scene.getPrimitives().add(labels);
    }

    function setLabelFont(scene, ellipsoid) {
        Sandcastle.declare(setLabelFont);   // For highlighting in Sandcastle.
        var labels = new Cesium.LabelCollection();
        labels.add({
            position  : ellipsoid.cartographicToCartesian(Cesium.Cartographic.fromDegrees(-75.10, 39.57)),
            text      : 'Philadelphia',
            // CSS font-family
            font      : '24px Helvetica',
            fillColor : { red : 0.0, blue : 1.0, green : 1.0, alpha : 1.0 },
            outlineColor : { red : 0.0, blue : 0.0, green : 0.0, alpha : 1.0 },
            outlineWidth : 2,
            style : Cesium.LabelStyle.FILL_AND_OUTLINE
        });
        scene.getPrimitives().add(labels);
    }

    function setLabelProperties(scene, ellipsoid) {
        Sandcastle.declare(setLabelProperties); // For highlighting in Sandcastle.
        var labels = new Cesium.LabelCollection();
        var l = labels.add({
            position : ellipsoid.cartographicToCartesian(Cesium.Cartographic.fromDegrees(-75.10, 39.57)),
            text     : 'Philadelphia'
        });

        l.setPosition(ellipsoid.cartographicToCartesian(Cesium.Cartographic.fromDegrees(-75.10, 39.57, 300000.0)));
        l.setScale(2.0);
        scene.getPrimitives().add(labels);
    }

    function addLabelsInReferenceFrame(scene, ellipsoid) {
        Sandcastle.declare(addLabelsInReferenceFrame);  // For highlighting in Sandcastle.
        var center = ellipsoid.cartographicToCartesian(Cesium.Cartographic.fromDegrees(-75.59777, 40.03883));
        var labels = new Cesium.LabelCollection(undefined);
        labels.modelMatrix = Cesium.Transforms.eastNorthUpToFixedFrame(center);
        labels.add({
            position : new Cesium.Cartesian3(0.0, 0.0, 0.0),
            text     : 'Center'
        });
        labels.add({
            position : new Cesium.Cartesian3(1000000.0, 0.0, 0.0),
            text     : 'East'
        });
        labels.add({
            position : new Cesium.Cartesian3(0.0, 1000000.0, 0.0),
            text     : 'North'
        });
        labels.add({
            position : new Cesium.Cartesian3(0.0, 0.0, 1000000.0),
            text     : 'Up'
        });
        scene.getPrimitives().add(labels);
    }

    function createButtons(widget) {
        var ellipsoid = widget.centralBody.getEllipsoid();
        var scene = widget.scene;
        var primitives = scene.getPrimitives();

        new Button({
            label: 'Add label',
            onClick: function() {
                primitives.removeAll();
                addLabel(scene, ellipsoid);
                Sandcastle.highlight(addLabel);
            }
        }).placeAt('toolbar');

        new Button({
            label: 'Set font',
            onClick: function() {
                primitives.removeAll();
                setLabelFont(scene, ellipsoid);
                Sandcastle.highlight(setLabelFont);
            }
        }).placeAt('toolbar');

        new Button({
            label: 'Set properties',
            onClick: function() {
                primitives.removeAll();
                setLabelProperties(scene, ellipsoid);
                Sandcastle.highlight(setLabelProperties);
            }
        }).placeAt('toolbar');

        new Button({
            label: 'Add labels in reference frame',
            onClick: function() {
                primitives.removeAll();
                addLabelsInReferenceFrame(scene, ellipsoid);
                Sandcastle.highlight(addLabelsInReferenceFrame);
            }
        }).placeAt('toolbar');
    }

    var widget = new Cesium.CesiumWidget('cesiumContainer');

    createButtons(widget);
    addLabel(widget.scene, widget.centralBody.getEllipsoid());

    Sandcastle.finishedLoading();
});

</script>
</body>
</html>

エラーは次のとおりです。

1)GET http://localhost/Source/Widgets/CesiumWidget/CesiumWidget.css 404 (Not Found) 

2) Uncaught ReferenceError: require is not defined

誰かが何が悪いのか教えてもらえますか? コード内で CesiumWidget.css ファイルが呼び出されている場所がわかりません。誰かが私を導くことができれば、それはとても役に立ちます。

require js を追加してみました。しかし、今ではもう1つのエラーが発生しています。

3) Uncaught SyntaxError: 入力の予期しない終了

画像を確認してください。なぜその行でエラーが発生するのですか。その表示されるエラーは、行に書かれている内容とはまったく関係ありません。

4

1 に答える 1