You should pass whole objects so they can be passed via an ajax call, if required.
For example, on the PHP side, create an array (or standard object). Then use json_encode.
In PHP:
$my_js_container = array(
'variable_1' => 'value 1',
'variable_2' => 'value 2'
);
On the template:
<script>
var php_vars = <?php echo json_encode( $my_js_container ); ?>;
alert( php_vars.variable_1 );
//or
$( "#series" ).chained( "#" + php_vars.variable_2 );
</script>
In this example, you're printing the json_encode string to the page. However, you could just as easily have the json_encode returned from a specific url that you load from an AJAX call. I see that you're using jQuery, so using jQuery, here is an example of how to load a variable from the client side (making a request to the server side):
http://api.jquery.com/jQuery.getJSON/
Try to pass your variable container around (in a uniform format), instead of single variables. It can come in handy later when you need to move to a different context (such as database, or template, or AJAX, or client-side store, or form submission).