Googleビジュアライゼーションで数字とパターンのフォーマッターを組み合わせるにはどうすればいいですか？

Question

私は、テーブル内のリンクを表示するためのパターン・フォーマットを持っている：

var options = { allowHtml: true, 
    cssClassNames: someClass, 
    width: 10, 
    height: 10 
}; 

var patterFormat = '<a href="http://somelink/{0}">{0}</a>'; 
var formatter = new google.visualization.PatternFormat(patterFormat); 
formatter.format(tableData, [0, 0]); 

table.draw(tableData, options); 

{0}はちょうどID（例えば12345）です。

何らかの理由で最近このコードの結果が変更されています（いくつかの更新があります）。今は12345ではなく<a href="http://somelink/12,345">12,345</a>のようなレンダリングされたHTMLページIDを取得しています。セパレータの種類PCのローカル設定に依存します。私は数値形式を設定して区切り記号を取り除くことができることを知っていますが、この方法でリンクを失います。誰かが私にどのようにパターンの数値フォーマットを設定することができますか？

Answer 1

あなたはパターン・フォーマットと数値の書式を組み合わせることができます

だけの数の書式を使用する必要がある最初の

はが直接番号フォーマットを提供することで、別のオプション次の例では

をUser Idコラムを参照してくださいdata

データテーブルの各セルは、値（v:）を持つことができます。そして列のフォーマットされた値（f:）

は、フォーマットされた値が提供され、これだけパターン・フォーマットを使用する必要が

google.charts.load('current', { 
 
    callback: function() { 
 
    var data = new google.visualization.DataTable({ 
 
     cols: [ 
 
     {label: 'Start Date', type: 'date'}, 
 
     {label: 'User Id', type: 'number'}, 
 
     {label: 'Customer Id', type: 'number'}, 
 
     {label: 'Amount', type: 'number'} 
 
     ], 
 
     rows: [ 
 
     {c:[{v: new Date('2016, 01, 01')}, {v: 44836}, {v: 067205, f: '067205'}, {v: 1122}]}, 
 
     {c:[{v: new Date('2016, 01, 01')}, {v: 86495}, {v: 067205, f: '067205'}, {v: 332}]}, 
 
     {c:[{v: new Date('2016, 01, 01')}, {v: 44836}, {v: 228626, f: '228626'}, {v: 0}]}, 
 
     {c:[{v: new Date('2016, 01, 01')}, {v: 86495}, {v: 228626, f: '228626'}, {v: 334}]}, 
 
     {c:[{v: new Date('2016, 02, 01')}, {v: 44836}, {v: 067205, f: '067205'}, {v: 554}]}, 
 
     {c:[{v: new Date('2016, 02, 01')}, {v: 86495}, {v: 067205, f: '067205'}, {v: 0}]}, 
 
     {c:[{v: new Date('2016, 02, 01')}, {v: 44836}, {v: 228626, f: '228626'}, {v: 0}]}, 
 
     {c:[{v: new Date('2016, 02, 01')}, {v: 86495}, {v: 228626, f: '228626'}, {v: 544}]}, 
 
     ] 
 
    }); 
 

 
    // format User Id number first 
 
    var numberFormat = new google.visualization.NumberFormat({ 
 
     pattern: '0' 
 
    }); 
 
    numberFormat.format(data, 1); 
 

 
    // format User Id pattern 
 
    var formatter = new google.visualization.PatternFormat(
 
     '<a href="http://somelink/{1}">{0}</a>' 
 
    ); 
 
    formatter.format(data, [0, 1], 1); 
 

 
    // format Customer Id pattern 
 
    formatter = new google.visualization.PatternFormat(
 
     '<a href="http://somelink/{1}">{0}</a>' 
 
    ); 
 
    formatter.format(data, [0, 2], 2); 
 

 
    new google.visualization.ChartWrapper({ 
 
     chartType: 'Table', 
 
     containerId: 'table-div', 
 
     dataTable: data, 
 
     options: { 
 
     allowHtml: true 
 
     }, 
 
     view: {'columns': [1, 2, 3]} 
 
    }).draw(); 
 
    }, 
 
    packages: ['corechart', 'table'] 
 
});

<script src="https://www.gstatic.com/charts/loader.js"></script> 
 
<div id="table-div"></div>