1
アニメーションを使用して列バーを作成しようとしていますが、それは私のためには機能しません。私は問題を示すためにPlunkerを作成しました。Googleグラフの列バーアニメーションが機能しません
私は間違っていますか？ここで
以前に私の例のコードを見ることができます：
<!DOCTYPE html>
<html>
<head>
<script data-require="[email protected]*" data-semver="2.0.0" src="https://code.angularjs.org/2.0.0-beta.6/angular2.min.js"></script>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
<script>
// Load the Visualization API and the corechart package.
google.charts.load('current', {'packages':['corechart']});
// Set a callback to run when the Google Visualization API is loaded.
google.charts.setOnLoadCallback(drawChart);
function drawChart(){
var options = {
width: 600,
height: 400,
bar: { groupWidth: "95%" },
animation: {
//startup: true,
duration: 2500,
easing: 'out',
},
vAxis: { title: "Espectadores", minValue: 0, maxValue: 1000 },
hAxis: {title: "Pelicula"},
};
var data = new google.visualization.DataTable();
data.addColumn('string', 'N');
data.addColumn('number', 'Value');
data.addColumn('number', 'id');
data.addRow(['El Padrino', 1000, 100]);
data.addRow(['StarWars', 543, 100]);
data.addRow(['Superman', 789, 100]);
data.addRow(['Alien', 850, 100]);
data.addRow(['El Padrino', 1000, 100]);
data.addRow(['StarWars', 543, 100]);
data.addRow(['Superman', 789, 100]);
data.addRow(['Alien', 850, 100]);
var view = new google.visualization.DataView(data);
view.setColumns([0, 1,
{
calc: "stringify",
sourceColumn: 1,
type: "string",
role: "annotation"
}]);
var chart = new google.visualization.ColumnChart(document.getElementById("test"));
chart.draw(view, options);
}
</script>
</head>
<body>
<h1>Hello Plunker!</h1>
<div id = "test"></div>
</body>
</html>
Uooooh !!!!できます！！！とてもありがとう@WhiteHat !!! –