質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
Highcharts

HighchartはHTML、SVG、VMLを使ったJavascriptの描写用ライブラリです。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

Q&A

解決済

2回答

6811閲覧

【highcharts】同じ種類のグラフを複数表示したい

pecchan

総合スコア555

Highcharts

HighchartはHTML、SVG、VMLを使ったJavascriptの描写用ライブラリです。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

0グッド

0クリップ

投稿2016/04/24 03:57

編集2016/04/24 06:19

【やりたいこと】
PHP+「highcharts」でグラフ作成に挑戦してます。
同一ページ内に、同じ種類のグラフを複数作成したいです。
※グラフ数は可変

【参考にしたページ】
円グラフ

例えばこの円グラフを3つにしたい場合です。
※数値データ自体はもちろん変えて

【調べた結果】
別種類のグラフを重ねたり、別種類のグラフを複数表示する方法は見つかりました。
ですが、今回やりたいことは「同じ種類の」グラフなので違うようでした。

【質問】
実現するにはどんな方法があるでしょうか?

グラフを作成したい回数だけhighchartsの「グラフ生成メソッド」を呼べば良いと考えましたが
html(view)側からjqueryのメソッドを複数回呼ぶことは可能なのでしょうか?
まずここが分かりません。

あるいは、jqueryのメソッド側を修正すべきでしょうか?

よければアドバイス宜しくお願い致します。

JavaScript

1<script type="text/javascript"> 2$(function () { 3 $('#container').highcharts({ 4 chart: { 5 type: 'pie', 6 }, 7 series: [{ 8 data: [ 9 ['Firefox',<?php echo $f_count; ?>], 10 ['IE', <?php echo $i_count; ?>], 11 ['Chrome', <?php echo $c_count; ?>], 12 ['Safari', <?php echo $s_count; ?>], 13 ['Opera', <?php echo $o_count; ?>], 14 ['Others', <?php echo $others; ?>] 15 ] 16 }] 17 }); 18}); 19</script> 20コード

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

kei344

2016/04/24 05:24

現在書かれている、JavaScriptのコードを追記されれば、回答を受けやすいと思います。
pecchan

2016/04/24 06:20

有難う御座います。 コードを追記致しました。
guest

回答2

0

ベストアンサー

こんな感じで動きませんか?

HTML

1<script type="text/javascript"> 2$(function () { 3 $('#container1').highcharts({ 4 chart: { 5 type: 'pie', 6 }, 7 series: [{ 8 data: [ 9 ['Firefox',<?php echo $c1_f_count; ?>], 10 ['IE', <?php echo $c1_i_count; ?>], 11 ['Chrome', <?php echo $c1_c_count; ?>], 12 ['Safari', <?php echo $c1_s_count; ?>], 13 ['Opera', <?php echo $c1_o_count; ?>], 14 ['Others', <?php echo $c1_others; ?>] 15 ] 16 }] 17 }); 18 $('#container2').highcharts({ 19 chart: { 20 type: 'pie', 21 }, 22 series: [{ 23 data: [ 24 ['Firefox',<?php echo $c2_f_count; ?>], 25 ['IE', <?php echo $c2_i_count; ?>], 26 ['Chrome', <?php echo $c2_c_count; ?>], 27 ['Safari', <?php echo $c2_s_count; ?>], 28 ['Opera', <?php echo $c2_o_count; ?>], 29 ['Others', <?php echo $c2_others; ?>] 30 ] 31 }] 32 }); 33}); 34</script> 35<div id="container1"></div> 36<div id="container2"></div>

投稿2016/04/24 06:26

kei344

総合スコア69364

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

pecchan

2016/04/24 06:39

kei344様 すいません。 冗長になるのは避けたいためご相談させていただきました。 同じ処理なので処理は「1つ」だけで実現したいです。 記載の通り、作成するグラフの数は可変(1~n個)です。 ※いくつ作成するかは画面からの指定次第。 なので、こちらの方法ですとグラフの数だけ処理は増えるので 対応出来ないです。
kei344

2016/04/24 07:06

> html(view)側からjqueryのメソッドを複数回呼ぶことは可能なのでしょうか? これに対して回答したつもりでした。複数回呼ぶことは可能です。 もう少し丁寧に回答できるように心がけます。
guest

0

foreach
で作成するグラフ数分、
出力することにしました。

お騒がせしました。

投稿2016/04/24 06:44

pecchan

総合スコア555

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問