働いていない複数のモリスグラフィックス -- jquery フィールド と graphics フィールド と morris.js フィールド 関連 問題

Multiple Morris graphics not working












1
vote

問題

日本語

Morris.jsプラグインを使用していくつかのグラフィックを使用しています。私はさまざまなドーナツグラフィックを持つページが必要ですが、それを1つずつ置くと最後のものはうまくいきません。

モリスコールは次のとおりです。

<事前> <コード> <div id="graphT"></div>

と、JSは次のとおりです。

<事前> <コード> <script type="text/javascript"> Morris.Donut({ element: 'graphT', data: [ {value: 50, label: '05'}, {value: 10, label: '07'}, {value: 40, label: '07'}, ], labelColor: '#000', colors: [ '#ae1c1c', '#000', '#cc9a00' ], formatter: function (x) { return x + "%"} }).on('click', function(i, row){ console.log(i, row); }); </script>

これでコード全体:

<事前> <コード> <div id="graphT"></div> <div id="TD"></div> <script type="text/javascript"> Morris.Donut({ element: 'graphT', data: [ {value: 50, label: '05'}, {value: 10, label: '07'}, {value: 40, label: '07'}, ], labelColor: '#000', colors: [ '#ae1c1c', '#000', '#cc9a00' ], formatter: function (x) { return x + "%"} }).on('click', function(i, row){ console.log(i, row); }); </script> <script type="text/javascript"> Morris.Donut({ element: 'TD', data: [ {value: 50, label: '05'}, {value: 10, label: '07'}, {value: 40, label: '07'}, ], labelColor: '#000', colors: [ '#ae1c1c', '#000', '#cc9a00' ], formatter: function (x) { return x + "%"} }).on('click', function(i, row){ console.log(i, row); }); </script>

誰もが何が起こっているのかについての考えを持っていますか? Morrisライブラリが必要なので、JSFilleに入れることはできません。

事前にありがとう。

英語

I'm using Morris.js plugin to use some graphics. I need a page with various Donuts graphics, but when I put more then one, the last one doesn't work.

The Morris call is:

<div id="graphT"></div> 

And, the JS is:

<script type="text/javascript">   Morris.Donut({     element: 'graphT',     data: [     {value: 50, label: '05'},     {value: 10, label: '07'},     {value: 40, label: '07'},     ],     labelColor: '#000',     colors: [     '#ae1c1c',     '#000',     '#cc9a00'     ],     formatter: function (x) { return x + "%"}   }).on('click', function(i, row){     console.log(i, row);   });   </script> 

Now the whole code:

<div id="graphT"></div> <div id="TD"></div>   <script type="text/javascript">   Morris.Donut({     element: 'graphT',     data: [     {value: 50, label: '05'},     {value: 10, label: '07'},     {value: 40, label: '07'},     ],     labelColor: '#000',     colors: [     '#ae1c1c',     '#000',     '#cc9a00'     ],     formatter: function (x) { return x + "%"}   }).on('click', function(i, row){     console.log(i, row);   });   </script>   <script type="text/javascript">   Morris.Donut({     element: 'TD',     data: [     {value: 50, label: '05'},     {value: 10, label: '07'},     {value: 40, label: '07'},     ],     labelColor: '#000',     colors: [     '#ae1c1c',     '#000',     '#cc9a00'     ],     formatter: function (x) { return x + "%"}   }).on('click', function(i, row){     console.log(i, row);   });   </script> 

Anyone have an idea about what's happening? I can't put it on JsFille, because needs the Morris library.

Thanks in advance.

</div
        
       
       

回答リスト

0
 
vote

Morris.jsの依存関係を輸入しましたか? <コード> raphael.js および<コード> jQuery です。

 

Did you also import morris.js' dependencies ? They are raphael.js and jQuery.

</div
 
 

関連する質問

0  Morris.js Djangoテンプレートアレイを使用して誤った線グラフを表示します  ( Morris js displaying incorrect line graph with django template array ) 
私は最近Morris.jsを聞いて、私が取り組んでいたウェブサイトに折れ線グラフを含めようとしました。ただし、私の日付配列からMorris.line()のデータコンポーネントに要素をフィードするたびに、グラフは正しく表示されず、代わりに奇妙な日付の束を表示しま...

6  DevTools Warning - 強制リフローはおそらくパフォーマンスのボトルネックです - Morris.js  ( Devtools warning forced reflow is a likely performance bottleneck morris js ) 
Morris.jsプラグインを使用して23のドーナツチャートを表示しているページを持っています。パフォーマンス分析中、私はこれに渡ってきました: もちろん、これらの警告のうち22人がいます。結果として生じる時間は401msです。 各ドーナツグラフの私の...

0  jQuery、Raphael、Morrisの読み込みの問題  ( Problems loading jquery raphael and morris ) 
HTMLでグラフを作成しようとしています、そして私はそれをすることを可能にするmorris.jsライブラリを見つけました。しかし、私はライブラリを接続しようとするという段階に問題があります。私は一部をモリスの公式ウェブサイトからコピーしましたが、それは機能し...

4  モリスグラフは常にラベルを表示します  ( Morris graph always display labels ) 
モリスチャートは、ユーザがDataPointsを越えてホバースしたときのラベルを示しています。 これらのホーバーは常に表示されています。 HideHover:Falseオプションを使用してみましたが、これは機能していません( http://jsfiddle....

0  モリスチャート - >変数をPHPに渡すためのHTML  ( Morris chart html to pass on a variable to php ) 
下記のコードは、毎日の毎週または月次データを含むモリスチャートを生成します。これは問題ありませんが、ドロップダウン「車」からの変数が渡され、SQL SELECTを実行するためのPHPでVARを作成する必要があります。 誰もが私がPHPでこのvarを生成するのを...

0  PHP Laravelのモリス線グラフ  ( Morris line graph in php laravel ) 
グラフに複数の行を入れる。 私のプロジェクトで - XAXIS-SP値 - S YAXIS -CMH値 テーブルの各レコード 各角度には、SP1~SP10、CMH1~CMH10 があります。 例えば: 角度25度プロット10点と形式線-10点(SP1、CM...

3  Morris.js X軸ラベルの高さ  ( Morris js x axis label height ) 
私はmorris.jsで生成されたチャートを持っていますが、x軸上のラベルは長く、ラベルを示す領域の高さが限られているために遮断されます。 以下のコードは、「County Park Road Elem」の部分ラベルのみを示すグラフをレンダリングします。テキス...

0  morris.jsカスタムXKey機能  ( Morris js custom xkey function ) 
私のウェブサイトでグラフを作ろうとしています、そして私は問題を発生しました:私はx軸のカスタムフォーマットで日付を持っていたいです。私のテストデータは次のようになります: <事前> <コード> var tax_data = [ {"date": "01...

1  1ページの1ページ以上のグラフを使用する方法Morris JS  ( How to use one graph more than 1 time on one page morris js ) 
1ページ以上1ページ以上のグラフを使用するMorris.js 例えば: <事前> <コード> element: 'sales_statistics', IDを使用していますが、代わりにクラスを使用することは可能です ...

3  Morris.js水平棒グラフ  ( Morris js horizontal bar chart ) 
Morris.jsで水平棒グラフを追加可能ですか? http://jsbin.com/uzosiq/2/embed?javascript_japrive < / a> ありがとうございました! ...




© 2022 cndgn.com All Rights Reserved. Q&Aハウス 全著作権所有