Personnaliser l'infobulle du tableau à bulles de l'API Google Charts

Question

J'essaie de changer l'infobulle des bulles dans le graphique à bulles de Google API.

Le rôle: l'info-bulle, qui résoudrait mon problème, ne fonctionne pas avec ce type de graphique.

Maintenant, ma bulle montre des informations sur les valeurs des lignes, ce qui est correct selon la documentation, mais j'ai seulement besoin de cette information pour dessiner le graphique et j'ai besoin d'afficher une chaîne comme info-bulle. Cette chaîne est composée de certaines des valeurs que j'ai besoin de formater.

Est-ce que cela peut être fait? Pour l'enregistrement j'utilise PHP pour servir les données par JSON au Javascript et j'utilise la dernière API de google (https://www.google.com/jsapi).

Ceci est ma définition des colonnes comme ils sont en ce moment:

$data['cols'][] = array('id' => 'ID', 'label' => 'ID', 'pattern' => "", 'type' => 'string'); 
$data['cols'][] = array('id' => 'Fecha', 'label' => 'Fecha', 'pattern' => "", 'type' => 'number'); 
$data['cols'][] = array('id' => 'h', 'label' => 'h', 'pattern' => "", 'type' => 'number'); 
$data['cols'][] = array('id' => 'stringRes', 'label' => 'Valor', 'pattern' => "", 'type' => 'string'); 
$data['cols'][] = array('id' => 'Resultado', 'label' => 'Resultado', 'pattern' => "", 'type' => 'number'); 

Merci à l'avance!

EDIT:

[SOLUTION]

Si quelqu'un pose la même question, je résolu mon problème en effaçant simplement les étiquettes des champs que je ne voulais pas montrer, et c'était tout!

J'ai changé colonnes modèle à ceci:

$data['cols'][] = array('id' => 'ID', 'label' => 'Fecha', 'pattern' => "", 'type' => 'string'); 
$data['cols'][] = array('id' => 'Fecha', 'label' => '', 'pattern' => "", 'type' => 'number'); 
$data['cols'][] = array('id' => 'h', 'label' => '', 'pattern' => "", 'type' => 'number'); 
$data['cols'][] = array('id' => 'stringRes', 'label' => 'Resultado', 'pattern' => "", 'type' => 'string'); 
$data['cols'][] = array('id' => 'Resultado', 'label' => '', 'pattern' => "", 'type' => 'number'); 

Merci @jmac pour donner une approche sur mon problème.

Answer 1

[SOLUTION]

Si quelqu'un pose la même question, je résolu mon problème en effaçant simplement les étiquettes des champs que je ne voulais pas montrer, et c'est tout!

J'ai changé colonnes modèle à ceci:

$data['cols'][] = array('id' => 'ID', 'label' => 'Fecha', 'pattern' => "", 'type' => 'string'); 
$data['cols'][] = array('id' => 'Fecha', 'label' => '', 'pattern' => "", 'type' => 'number'); 
$data['cols'][] = array('id' => 'h', 'label' => '', 'pattern' => "", 'type' => 'number'); 
$data['cols'][] = array('id' => 'stringRes', 'label' => 'Resultado', 'pattern' => "", 'type' => 'string'); 
$data['cols'][] = array('id' => 'Resultado', 'label' => '', 'pattern' => "", 'type' => 'number'); 

Merci @jmac pour donner une approche sur mon problème.

Answer 2

Vous pouvez utiliser setFormattedValue() sur vos données afin d'utiliser une valeur pour dessiner le graphique, et un nombre différent pour apparaître lorsque vous le survolez. Parce que vous importez des données et nous ne pouvons pas voir le format, il n'y a pas grand-chose que nous pouvons faire pour vous dire exactement comment le gérer, mais voici un exemple:

var drawVisualizations = function() { 
    // Create and populate a data table. 
    var data = new google.visualization.DataTable(); 
    data.addColumn('string', 'Force'); 
    data.addColumn('number', 'Level'); 

    // Add 2 rows. 
    // google.visualization.DataTable.addRows() can take a 2-dim array of values. 
    data.addRows([['Fire', 1], ['Water', 5]]); 

    // Add one more row. 
    data.addRow(['sand', 4]); 

    // Draw a table with this data table. 
    var originalVisualization = new google.visualization.Table(document.getElementById('original_data_table')); 
    originalVisualization.draw(data); 

    // Clone the data table and modify it a little. 
    var modifiedData = data.clone(); 

    // Modify existing cell. 
    modifiedData.setFormattedValue(1, 1, "one"); 

    // Draw a table with this data table. 
    var modifiedVisualization = new google.visualization.Table(document.getElementById('modified_data_table')); 
    modifiedVisualization.draw(modifiedData); 
} 

Dans votre cas, vous besoin de créer une fonction pour parcourir votre tableau de données et formater vos éléments comme vous le souhaitez, mais en tout cas cela vous donnera la possibilité de faire un tracé de numéros comme une chose, mais afficher comme un autre.