Q&A
回答ありがとうございます。すいません確かにターゲットとして表示するidを付属していなかったです。ありがとうございました。修正しましたが、まだ表示されないので他でも不足している部分があるみたいです。ドキュメントを再度見直してみます。
###前提・実現したいこと
初めてjqplotを使用するのですが表示が上手くいきません
こちらのサイトを参考に作成しました。
http://alphasis.info/2012/02/jquery-plugin-jqplot-horizontal_bar_charts-rendereroptions/
###発生している問題・エラーメッセージ
検証をした際に表示されます。
jquery.jqplot.min.js:3 Uncaught Error: No plot target specified
###該当のソースコード
php
1<!DOCTYPE> 2<html> 3<head> 4 <meta charset="utf-8"> 5 <!--[if lt IE 9]><script language="javascript" type="text/javascript" src="./jquery/dist/excanvas.js"></script><![endif]--> 6 <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script> 7 <script type="text/javascript" src="jquery.jqplot.min.js"></script> 8 <script type="text/javascript" src="plugins/jqplot.barRenderer.min.js"></script> 9 <script type="text/javascript" src="plugins/jqplot.categoryAxisRenderer.min.js"></script> 10 <script type="text/javascript" src="jquery.jqplot.min.css"></script> 11</head> 12<body> 13 <script> 14 jQuery( function() { 15 jQuery . jqplot( 16 'jqPlot-sample', 17 [ 18 [ [ 65, '4月' ], [ 72, '5月' ], [ 74, '6月' ], [ 63, '7月' ], [ 85, '8月' ], [ 90, '9月' ] ], 19 [ [ 38, '4月' ], [ 54, '5月' ], [ 65, '6月' ], [ 89, '7月' ], [ 91, '8月' ], [ 75, '9月' ] ] 20 ], 21 { 22 axes: { 23 yaxis: { 24 renderer: jQuery . jqplot . CategoryAxisRenderer, 25 } 26 }, 27 seriesDefaults: { 28 renderer: jQuery . jqplot . BarRenderer, 29 rendererOptions: { 30 barPadding: 8, 31 barMargin: 10, 32 barDirection: 'horizontal', 33 barWidth: null, 34 shadowOffset: 2, 35 shadowDepth: 5, 36 shadowAlpha: 0.08, 37 } 38 } 39 } 40 ); 41} ); 42</script> 43</body> 44</html>
###試したこと
パスの確認は大丈夫だと思います。
簡単な表は作成できましたが上記のようにプラグインを使用するとできません。
下記の簡単な表は表示できました。
質問がまだ不慣れなのでわかりにくい際はおっしゃってください
php
1<!DOCTYPE> 2<html> 3<head> 4 <meta charset="utf-8"> 5 <!--[if lt IE 9]><script language="javascript" type="text/javascript" src="./jquery/dist/excanvas.js"></script><![endif]--> 6 <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script> 7 <script type="text/javascript" src="jquery.jqplot.min.css"></script> 8 <script type="text/javascript" src="jquery.jqplot.min.js"></script> 9</head> 10<body> 11 <div id='target_for_jqplot' style='width:400px; height:300px;'></div> 12 <script type='text/javascript'> 13 $.jqplot( 14 'target_for_jqplot', 15 [ 16 [[1, 10], [2, 20], [3, 30], [4, 40], [5, 50], [6, 60]], 17 [[1, 2], [2, 4], [3, 8], [4, 16], [5, 32], [6, 64]] 18 ] 19 ) 20 </script> 21</body> 22</html>
###補足情報(言語/FW/ツール等のバージョンなど)
MAMP mac
回答2件
0
jqueryのVerを1.8.3に変更しましたら表示されました。
投稿2016/06/27 01:21
退会済みユーザー
総合スコア0
0
ベストアンサー
jqPlot-sampleの表示先が無いですよ
投稿2016/06/26 23:18
退会済みユーザー
総合スコア0
おぉ
ｻｲﾄのをｺﾋﾟﾍﾟしただけですが参考に
<!DOCTYPE>
<html>
<head>
<meta charset="utf-8">
<script src="//code.jquery.com/jquery-1.8.3.js"></script>
<script src="//cdn.jsdelivr.net/jqplot/1.0.8/jquery.jqplot.min.js"></script>
<script src="//cdn.jsdelivr.net/jqplot/1.0.8/plugins/jqplot.barRenderer.min.js"></script>
<script src="//cdn.jsdelivr.net/jqplot/1.0.8/plugins/jqplot.categoryAxisRenderer.min.js"></script>
<link rel="stylesheet" href="//cdn.jsdelivr.net/jqplot/1.0.8/jquery.jqplot.min.css">
</head>
<body>
<div id="jqPlot-sample" style="height: 300px; width: 300px;"></div>
<script>
jQuery( function() {
jQuery . jqplot(
'jqPlot-sample',
[
[ [ 65, '4月' ], [ 72, '5月' ], [ 74, '6月' ], [ 63, '7月' ], [ 85, '8月' ], [ 90, '9月' ] ],
[ [ 38, '4月' ], [ 54, '5月' ], [ 65, '6月' ], [ 89, '7月' ], [ 91, '8月' ], [ 75, '9月' ] ]
],
{
axes: {
yaxis: {
renderer: jQuery . jqplot . CategoryAxisRenderer,
}
},
seriesDefaults: {
renderer: jQuery . jqplot . BarRenderer,
rendererOptions: {
barPadding: 8,
barMargin: 10,
barDirection: 'horizontal',
barWidth: null,
shadowOffset: 2,
shadowDepth: 5,
shadowAlpha: 0.08,
}
}
}
);
} );
</script>
</body>
</html>
ありがとうございます！！jqueryのVersionが悪かったみたいです。
新しいVersionでやっていました汗
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
退会済みユーザー
2016/06/27 01:27
退会済みユーザー
2016/06/27 01:36 編集
退会済みユーザー
2016/06/27 01:35