Can not pass the value of google pie chart from custom meta box

Basics

First you need to register the Google JSAPI script. Else you won’t have access to it. And you will need to hook it to admin_enqueue_scripts to have it available in the meta box. Also the JSAP needs to get loaded before your custom script, so you need to set it as dependency. Example:

add_action( 'admin_enqueue_scripts', 'pie_load_scripts' );
function pie_load_scripts()
{
    wp_enqueue_script(
        'google-jsapi',
        '//www.google.com/jsapi',
        array(),
        0,
        true
    );
    wp_enqueue_script(
        'pie-script',
        plugin_dir_url( __FILE__ ).'js/3dpiechart.js',
        array( 'google-jsapi' ),
        filemtime( plugin_dir_path( __FILE__ ).'js/3dpiechart.js' ),
        true
    );
    wp_localize_script(
        'pie-script',
        'pie_script_vars',
        array(
            'meta' => get_post_custom( get_the_ID() ),
        )
    );
}

Note: avoiding the http(s): scheme allows the remote server to decide which script to deliver. It’s probably https.

Maintainability

As you can see, I have dropped the numerous get_post_meta() calls in favor of a single get_post_custom( get_the_ID() ); call. This means that your meta data is available in your JavaScript ~/js/3dpiechart.js with pie_script_vars.meta. From there on you should be able to include the Pie Chart. Your meta data probably looks like the following (example/shortened):

array (size=3)
  '_edit_lock' => 
    array (size=1)
      0 => string '1407164887:1' (length=12)
  '_edit_last' => 
    array (size=1)
      0 => string '1' (length=1)
  'wpse_some_key' => 
    array (size=1)
      0 => string 'Lorem ipsum dolor sitem... tja.' (length=31)

In this case, you would reference your meta data with jsapi.wpse_some_key[0]. It’s easy to maintain that way, because you avoid changing the keys in PHP and JS every time you change something.

In a theme

Simply change your scripts hook to wp_enqueue_scripts – or for a login/register/password-lost page use login_enqueue_scripts.

Example plugin

A quick working (tested) example plugin with the mock data from the Google Tutorial:

<?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__ ).'js/jsapi.js',
        array( 'google-jsapi', ),
        filemtime( plugin_dir_path( __FILE__ ).'js/jsapi.js' ),
        true
    );
    wp_localize_script(
        'jsapi',
        'jsapi',
        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
}

Then add subfolder named js in your plugin folder and add a file named jsapi.js with the following contents:

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

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

    google.load( "visualization", "1", {
        packages : [ "corechart" ]
    } );
    google.setOnLoadCallback( function() {
        var data = google.visualization.arrayToDataTable( [
                [ 'Task',    'Hours per Day' ],
                [ 'Work',     11 ],
                [ 'Eat',      2 ],
                [ 'Commute',  2 ],
                [ 'Watch TV', 2 ],
                [ 'Sleep',    7 ]
            ] ),
            chart = new google.visualization.PieChart( document.getElementById( 'piechart' ) );

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

The plugin will print a quick and small chart into your meta box.

Download

The example plugin is available as GitHub GistView Source.