ich möchte mithilfe von Javascript (und mithilfe von Googles Chart API) dem Benutzer einer Website es zu ermöglichen selbst zu agieren, das bedeutet das er die Seite wie eine App nutzen kann (mit HTML5 Elementen, aber das ist gerade nicht wichtig). Ich möchte mit hilfe des Javascript Button einen Eintrag in einem Diagramm erzeugen.
Als Beispiel
function drawVisualization() { var data = new google.visualization.DataTable(); data.addColumn('date', 'Date'); data.addColumn('number', 'Sold Pencils'); data.addColumn('string', 'title1'); data.addColumn('string', 'text1'); data.addColumn('number', 'Sold Pens'); data.addColumn('string', 'title2'); data.addColumn('string', 'text2'); data.addColumn('number', 'Sold Papers'); data.addRows(6); data.setValue(0, 0, new Date(2009, 1 ,1)); data.setValue(0, 1, 30000); data.setValue(0, 4, 4645); data.setValue(0, 7, 12345); data.setValue(1, 0, new Date(2009, 1 ,2)); data.setValue(1, 1, 14045); data.setValue(1, 4, 2374); .....
Beim drücken de Button soll so eine Art Eintrag erstellt werden und mittels Google Chart API dargestellt werden.
Hat jemand von euch eine Idee wie man das bewerkstelligen kann?
Willst Du das was Du gepostet hast einfach nur bei einem Klick auf einen Button in das Diagramm einfügen, oder soll der Benutzer zu dem was Du gepostet hast noch Daten hinzufügen können, die dann beim Klick auf den Button in das Diagramm eingefügt werden?
Ok, dann probier ich mal einfach eine Lösung auf gut Glück. Ich hab mir folgendes Beispiel angeguckt. Das heißt, mit
google.load('visualization', '1.0', {'packages':['corechart']}); google.setOnLoadCallback(drawChart); function drawVisualization() { var data = new google.visualization.DataTable(); data.addColumn('string', 'foo'); data.addColumn('number', 'bar'); data.addRows([ ... ]); var options = {'title':'...','width':400,'height':300}; var chart = new google.visualization.PieChart(document.getElementById('chart_div')); chart.draw(data, options); }
erzeug ich ein Diagramm. Wenn das Beispiel nicht lügt und ich mich nicht irre, könnte man einfach folgendes machen
function call_drawVisualization() { google.load('visualization', '1.0', {'packages':['corechart']}); google.setOnLoadCallback(drawChart); function drawVisualization() { ... data.addRows([ ... ]); ... chart.draw(data, options); } }
Jetzt weiß ich nicht, woher der User-Input kommt. Den könntest Du entweder beim onclick auf den Button direkt an die function übergeben, oder innerhalb der function aus einem formfield saugen, ... geht mit jQuery ja alles ziemlich einfach. Das müßte dann noch an passender Stelle in data eingefügt werden, z.B.
und dann könnte das klappen. Wie gesagt, ist eine Lösung auf gut Glück. Mehr ein Denkansatz. Ich hab mit der Google Chart API noch nie was gemacht. Kann auch sein, daß das gar nicht funktioniert und ich total falsch liege. Das würd dann auch erklären, warum noch kein anderer hier was geschrieben hat :)