2

標準の HTML タイトル属性を使用して、ロールオーバー時に値 (「v」) を表示したいと考えています (他の目的のために他の属性を配置する中で)。

視覚化のドキュメントによると、これは「p プロパティ」を介して実行できます。ただし、以下のコードからは、className のみが td タグの属性としてレンダリングされます。

「スタイル」属性がドキュメントから直接コピーされた例であることを考えると - https://developers.google.com/chart/interactive/docs/reference#cell_object、私は何か間違ったことをしていると思います。あなたはそれが何であるかを見ることができますか？

セル オブジェクト:

{
      "v": "\/?s=mi+shampoo+adecuado?&submit=Buscar",
      "f": "\/?s=m...uscar",
      "p": {
        "title": "\/?s=mi+shampoo+adecuado?&submit=Buscar",
        "style": "border: 1px solid green;",
        "className": "randomCls",
        "data-title": "\/?s=mi+shampoo+adecuado?&submit=Buscar"
      }
    },

可視化コード

var table = new google.visualization.DataTable();
for(var j=0; j < data[0].length; j++) {
    table.addColumn(typeof data[1][j].v,data[0][j]);
}
data.shift();
table.addRows(data);
var ac = new google.visualization.Table(graph.get(0)); // AreaChart

ac.draw(table, {
    backgroundColor: {fill:'#d4d4d4'},
    colors : ["#999999",'#004087']
});
4

2 に答える 2

3

テーブル ビジュアライゼーションは、セルの「className」および「style」プロパティのみをサポートします。追加の HTML プロパティをセルに適用する必要がある場合は、カスタム コードを記述し<table>て、視覚化によって作成された要素を解析し、プロパティを<td>要素に手動で追加する必要があります。要素ではなくセルの内容にプロパティを配置できる場合は、<td>必要な HTML を含むようにセルの書式設定された値を設定できます。

于 2013-09-04T18:16:23.090 に答える
0

サポートされている属性について説明してくれた @asgallant に感謝します。したがって、それに応じたコードは次のとおりです。

var wrapper = new google.visualization.ChartWrapper({
            chartType: 'Table',
            dataTable: table,
            options: {backgroundColor: {fill:'#d4d4d4'}, colors : ["#999999",'#004087'], allowHtml:true},
            containerId: 'widget'+wid
});

google.visualization.events.addListener(wrapper, 'ready', function() {
    graph.find(".tipFlag").each(function(){
         var v = $(this).attr("class").substring("tipFlag ".length);
         $(this).attr("title", v);
    });
});

wrapper.draw();

新しいセル オブジェクトは次のようになります。

{
  "v": "\/?s=mi+shampoo+adecuado?&submit=Buscar",
  "f": "\/?s=m...uscar",
  "p": {
    "className": "tipFlag \/?s=mi+shampoo+adecuado?&submit=Buscar",
  }
},
于 2013-09-04T18:38:47.050 に答える