javascript - tipos - ¿Cómo cambiar el texto de información sobre herramientas para google chart api?

haxis google chart

Question

http://code.google.com/apis/chart/

<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">

  // Load the Visualization API and the piechart package.
  google.load(''visualization'', ''1'', {''packages'':[''corechart'']});

  // Set a callback to run when the Google Visualization API is loaded.
  google.setOnLoadCallback(drawChart);

  // Callback that creates and populates a data table, 
  // instantiates the pie chart, passes in the data and
  // draws it.
  function drawChart() {

  // Create our data table.
  var data = new google.visualization.DataTable();
  data.addColumn(''string'', ''date'');
  data.addColumn(''number'', ''Views'');
  data.addColumn(''number'', ''People'');
  data.addRows([
    <?php echo $analytics; ?>
  ]);
  // Instantiate and draw our chart, passing in some options.
  var chart = new google.visualization.AreaChart(document.getElementById(''Analytics-Visualization''));
  chart.draw(data, {lineWidth:3, pointSize:8, width: 745, height: 240,chartArea:{left:20,top:20,width:640}});
}
</script>

digamos que cuando hacemos esto hace esto

a

tal vez usando las cosas del oyente?

Answer 1

@Adán; Si desea editar texto, consulte este http://code.google.com/apis/ajax/playground/?type=visualization#pie_chart

puedes cambiar tu código desde aquí

function drawVisualization() {
  // Create and populate the data table.
  var data = new google.visualization.DataTable();
  data.addColumn(''string'', ''Task'');
  data.addColumn(''number'', ''Hours per Day'');
  data.addRows(5);
  data.setValue(0, 0, ''Work'');
  data.setValue(0, 1, 11);
  data.setValue(1, 0, ''Eat'');
  data.setValue(1, 1, 2);
  data.setValue(2, 0, ''Commute'');
  data.setValue(2, 1, 2);
  data.setValue(3, 0, ''Watch TV'');
  data.setValue(3, 1, 2);
  data.setValue(4, 0, ''Sleep'');
  data.setValue(4, 1, 7);

y si quieres tu custom tooltip debes usar javascript para estos

http://code.google.com/p/gvtooltip/

http://informationandvisualization.de/blog/tooltips-google-chart-api

Answer 2

Encontré este enlace https://gist.github.com/alexrainman/bb8d49357250df0859c0 para personalizar la información sobre herramientas del gráfico circular ... Espero que esto ayude ... funcionó perfectamente para mí :)

Answer 3

Para información sobre herramientas personalizadas, agregue la información sobre herramientas como una columna adicional:

function drawVisualization() {
    data = new google.visualization.DataTable()
    data.addColumn(''string'', ''Date'');
    data.addColumn(''number'');
    data.addColumn({type:''string'',role:''tooltip''});
    data.addRow();
    base = 10;
    data.setValue(0, 0, ''Datapoint1'');
    data.setValue(0, 1, base++);
    data.setValue(0, 2, " This is my tooltip1 ");

    data.addRow();
    data.setValue(1, 0, ''Datapoint2'');
    data.setValue(1, 1, base++);
    data.setValue(1, 2, "This is my second tooltip2");

    // Draw the chart.
    var chart = new google.visualization.BarChart(document.getElementById(''visualization''));
    chart.draw(data, {legend:''none'', width:600, height:400});
}