WordPress plugin to add a Google Pie Charts / Visualization in a MetaBox.

google_jsapi.php

<?php

namespace WPSE;

/** Plugin Name: Google JSAPI test plugin */

add_action( 'admin_enqueue_scripts', __NAMESPACE__.'\addScripts' );
function addScripts()
{
	wp_enqueue_script(
		'google-jsapi',
		'//www.google.com/jsapi',
		array(),
		0,
		true
	);

	wp_enqueue_script(
		'jsapi',
		plugin_dir_url( __FILE__ ).'jsapi.js',
		array( 'google-jsapi', ),
		filemtime( plugin_dir_path( __FILE__ ).'jsapi.js' ),
		true
	);
	wp_localize_script(
		'jsapi',
		'jsapi',
		array( 'exampleData' => array(
			array( 'Task',    'Hours per Day', ),
			array( 'Work',     11, ),
			array( 'Eat',      2, ),
			array( 'Commute',  2, ),
			array( 'Watch TV', 2, ),
			array( 'Sleep',    7, ),
		) )
		# In a real plugin, use the following instead:
		// get_post_custom( get_the_ID() )
	);
}

add_action( 'add_meta_boxes_post', __NAMESPACE__.'\addMetaBox' );
function addMetaBox( $post )
{
	add_meta_box(
		'piechart',
		__( 'Your Data', 'your_textdomain' ),
		__NAMESPACE__.'\MetaBoxContents',
		'post'
	);
}
function MetaBoxContents( $data )
{
	?><div id="piechart"></div><?php
}

jsapi.js

/*globals jQuery, $, jsapi, google */

( function( $, plugin ) {
	"use strict";

	// Look at your Dev Tools console
	console.log( plugin );

	google.load( "visualization", "1", {
		packages : [ "corechart" ]
	} );
	google.setOnLoadCallback( function() {
		var container = document.getElementById( 'piechart' ),
			data = google
				.visualization
				.arrayToDataTable( plugin.exampleData ),
			chart = new google
				.visualization
				.PieChart( container );

		chart.draw( data, {
			title : 'My Daily Activities'
		} );
	} );
} )( jQuery, jsapi || {} );