1
jQuery切り替え可能タブ（Ruby on Railsとbootstrap-tab.jsを使用）の中にjavascriptチャートを表示しようとしています。タブがタブの外にある場合、タブは表示されますが、タブの内側には表示されません。私は非常に簡単なことを見落としていると確信していますが、私はこの問題に苦労しています。 jQuery切り替え可能タブ内のJavaScriptチャート
マイビューコード：<ul class="nav nav-tabs">
<li class="active"><a href="#home" data-toggle="tab">Home</a></li>
<li><a href="#graph" data-toggle="tab">Graph</a></li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="home">...</div>
<div class="tab-pane" id="graph">
<div id="chartdiv" style="width: 100%; height: 400px;"></div>
</div>
Javascriptのコード：
<script type="text/javascript">
$(function() {
$ ('a#graph').click(function(){
var chart;
var chartData = [{
country: "USA",
visits: 4025
}, {
country: "Poland",
visits: 328
}];
AmCharts.ready(function() {
// SERIAL CHART
chart = new AmCharts.AmSerialChart();
chart.dataProvider = chartData;
chart.categoryField = "country";
chart.startDuration = 1;
// AXES
// category
var categoryAxis = chart.categoryAxis;
categoryAxis.labelRotation = 90;
categoryAxis.gridPosition = "start";
// GRAPH
var graph = new AmCharts.AmGraph();
graph.valueField = "visits";
graph.balloonText = "[[category]]: [[value]]";
graph.type = "column";
graph.lineAlpha = 0;
graph.fillAlphas = 0.8;
chart.addGraph(graph);
chart.write("chartdiv");
});
});
});
</script>
と、この：私はこれを試してみた
<script type="text/javascript">
var chart;
var chartData = [{
country: "USA",
visits: 4025
}, {
country: "Poland",
visits: 328
}];
AmCharts.ready(function() {
// SERIAL CHART
chart = new AmCharts.AmSerialChart();
chart.dataProvider = chartData;
chart.categoryField = "country";
chart.startDuration = 1;
// AXES
// category
var categoryAxis = chart.categoryAxis;
categoryAxis.labelRotation = 90;
categoryAxis.gridPosition = "start";
// GRAPH
var graph = new AmCharts.AmGraph();
graph.valueField = "visits";
graph.balloonText = "[[category]]: [[value]]";
graph.type = "column";
graph.lineAlpha = 0;
graph.fillAlphas = 0.8;
chart.addGraph(graph);
chart.write("chartdiv");
});
});
});
</script>
すべてのヘルプやポインタだろう大変感謝します。