1

http://dojotoolkit.org/reference-guide/1.8/dojox/widget/AnalogGauge.html#speedometer-style-gauge-with-arc-indicator-and-needle-indicatorの簡単な例を試しています。 最初はそうではありませんでしたdijit が見つからないため、動作しています。私が試しているコードは次のとおりです( <head > の後のスニペット)

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.7.3/dijit/themes/claro/claro.css" media="screen">
    <script src="http://ajax.googleapis.com/ajax/libs/dojo/1.8.0/dojo/dojo.js"></script>
<meta charset="utf-8">
    <script>
        dojoConfig = {
            parseOnLoad : true
        }
    </script>
    <script>
        dojo.require("dojox.widget.AnalogGauge");
        dojo.require("dijit.Dialog");
        dojo.require("dojox.widget.gauge.AnalogArcIndicator");
        dojo.require("dojox.widget.gauge.AnalogNeedleIndicator");

        dojo.ready(function() {
            var gauge = dijit.byId('speedo');
            // Used for a gradient arc indicator below:
            var fill = {
                'type' : 'linear',
                'x1' : 50,
                'y1' : 50,
                'x2' : 350,
                'y2' : 350,
                'colors' : [{
                    offset : 0,
                    color : 'black'
                }, {
                    offset : 0.5,
                    color : 'black'
                }, {
                    offset : 0.75,
                    color : 'yellow'
                }, {
                    offset : 1,
                    color : 'red'
                }]
            };
            gauge.addIndicator(new dojox.widget.gauge.AnalogArcIndicator({
                'value' : 200,
                'width' : 20,
                'offset' : 150,
                'color' : fill,
                'noChange' : true,
                'hideValues' : true
            }));
            gauge.addIndicator(new dojox.widget.gauge.AnalogArcIndicator({
                'value' : 80,
                'width' : 10,
                'offset' : 150,
                'color' : 'blue',
                'title' : 'Arc',
                'hover' : 'Arc: 80'
            }));
            gauge.addIndicator(new dojox.widget.gauge.AnalogNeedleIndicator({
                'value' : 100,
                'width' : 8,
                'length' : 150,
                'color' : 'red',
                'title' : 'Needle',
                'hover' : 'Needle: 100'
            }));
        });
    </script>
</head>
<body class="claro">
    <div data-dojo-type="dojox.widget.AnalogGauge"
    id='speedo'
    width="450"
    height="300"
    cx="225"
    cy="175"
    radius="150"
    startAngle="-135"
    endAngle="135"
    useRangeStyles="0"
    hideValues="true"
    color: "white"
    majorTicks="{length: 10, offset: 105, interval: 10, color: 'gray'}"
    minorTicks="{length: 5, offset: 105, interval: 5, color: 'gray'}">
        <div data-dojo-type="dojox.widget.gauge.Range"
        low="0"
        high="100"
        color="{'color': 'black'}"></div>
        <div data-dojo-type="dojox.widget.gauge.Range"
        low="100"
        high="200"
        color="{'color': 'black'}"></div>
    </div>
</body>

ブラウザのコンソール ウィンドウから、「Uncaught TypeError: Cannot read property "'_Gauge"' of undefined dojo」というエラーが表示されます。しかし、どこが間違っているのかわかりません。これについていくつかの助けを提供してください。

4

2 に答える 2

0

あなたが配置する必要があるようです

<script>
    dojoConfig = {
        parseOnLoad : true
    }
</script>

dojo.jsスクリプトを含める前に。また、をrequireしdojo.parser、requireforを削除する必要がありdijit.Dialogます。何をしているのかわかりませんdijit.Dialogが、に影響しているようdojox.widget.AnalogGaugeです。これらの変更を行った後、私はあなたの例をロードして動作するのを見ることができるようです。以下は、あなたの例の完全な編集バージョンです。

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.7.3/dijit/themes/claro/claro.css" media="screen">
<script>
    dojoConfig = {
        parseOnLoad : true
    }
</script>
<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.8.0/dojo/dojo.js"></script>
<meta charset="utf-8"> 
<script>
    dojo.require("dojo.parser");
    dojo.require("dojox.widget.AnalogGauge");
    dojo.require("dojox.widget.gauge.AnalogArcIndicator");
    dojo.require("dojox.widget.gauge.AnalogNeedleIndicator");

    dojo.ready(function() {
        var gauge = dijit.byId('speedo');
        // Used for a gradient arc indicator below:
        var fill = {
            'type' : 'linear',
            'x1' : 50,
            'y1' : 50,
            'x2' : 350,
            'y2' : 350,
            'colors' : [{
                offset : 0,
                color : 'black'
            }, {
                offset : 0.5,
                color : 'black'
            }, {
                offset : 0.75,
                color : 'yellow'
            }, {
                offset : 1,
                color : 'red'
            }]
        };
        gauge.addIndicator(new dojox.widget.gauge.AnalogArcIndicator({
            'value' : 200,
            'width' : 20,
            'offset' : 150,
            'color' : fill,
            'noChange' : true,
            'hideValues' : true
        }));
        gauge.addIndicator(new dojox.widget.gauge.AnalogArcIndicator({
            'value' : 80,
            'width' : 10,
            'offset' : 150,
            'color' : 'blue',
            'title' : 'Arc',
            'hover' : 'Arc: 80'
        }));
        gauge.addIndicator(new dojox.widget.gauge.AnalogNeedleIndicator({
            'value' : 100,
            'width' : 8,
            'length' : 150,
            'color' : 'red',
            'title' : 'Needle',
            'hover' : 'Needle: 100'
        }));
    });
</script>
</head>
<body class="claro">
    <div data-dojo-type="dojox.widget.AnalogGauge"
         id='speedo'
         width="450"
         height="300"
         cx="225"
         cy="175"
         radius="150"
         startAngle="-135"
         endAngle="135"
         useRangeStyles="0"
         hideValues="true"
         color: "white"
         majorTicks="{length: 10, offset: 105, interval: 10, color: 'gray'}"
         minorTicks="{length: 5, offset: 105, interval: 5, color: 'gray'}">
    <div data-dojo-type="dojox.widget.gauge.Range"
                 low="0"
                 high="100"
                 color="{'color': 'black'}"></div>
            <div data-dojo-type="dojox.widget.gauge.Range"
                 low="100"
                 high="200"
                 color="{'color': 'black'}"></div>
     </div>
</body>
于 2012-12-05T20:38:16.827 に答える
0

dojox/widget/AnalogGauge.js の Javascript ファイルは、dojox/gauges/AnalogGauge への単なるマッピングであることがわかります。

dojox/widget/AnalogGauge を dojox/gauges/AnalogGauge に変更すると、突然動作します。

何が起こっているのかは完全にはわかりませんが、dojox/gauges/AnalogGauge.js ファイル内の「./_Gauge」の相対パスを妨害していると推測されます。

この質問が少し古いことは承知していますが、この問題は dojo 1.9 でも未解決のままです。解決策を検索したときにこのページが 1 位にランクされたので、ここで見つけたことを記録しておきます。

于 2013-06-11T16:44:20.377 に答える