wpDataTablesを利用してGoogle Chartから出力するグラフをカスタマイズする

利用プラグイン

• wpDataTables 
  • https://wordpress.org/plugins/wpdatatables/

カスタマイズのコード

Google Chartをカスタマイズする際にはJSを利用する

wpDataChartsCallbacks[i] のiの部分にカスタマイズしたいchartのIDを入れる。

下記のサンプルでは、1と2が対象となるが、実際に全部に設定したいのなら。PHPで数を配列に取ってからループを回す必要がありそう。このカスタマイズは色を変更しています。

<script>
jQuery(window).on('load', function(){
	
if( typeof wpDataChartsCallbacks == 'undefined' ){ wpDataChartsCallbacks = {}; }
for (  var i = 1;  i < 3;  i++  ) {
	wpDataChartsCallbacks[i] = function(obj){
			obj.options.slices = {
            0: { color: '#fff' },
            1: { color: 'blue' },
            2: { color: 'red' },
            3: { color: '#000' },
          }
	}
}
});
</script>

オプションなどの設定項目はドキュメントを参照

• https://developers.google.com/chart/interactive/docs/gallery/piechart?hl=ja