jQuery signe dollar n'est pas défini

Dans ma quête pour obtenir des renseignements historiques, j'ai essayé d'utiliser le code ci-dessous. Chrome débogueur dit que Uncaught ReferenceError: $ is not defined. Pouvez-vous suggérer une solution, je suis vraiment coincé. J'ai juste besoin que cela fonctionne sur Chrome, et je suis en puisant dans la YQL et API Yahoo.

voici le jsFiddle http://jsfiddle.net/pCK5q/1/

<html>
<head>      
<script type='text/javascript' src='http://www.google.com/jsapi'></script>
<script type='text/javascript'>
google.load('visualization', '1', {'packages':['annotatedtimeline']});
google.setOnLoadCallback(drawChart);
function drawChart() {
var data = new google.visualization.DataTable();
/* historical data code that breaks */
var url = 'http://query.yahooapis.com/v1/public/yql';
var startDate = '2012-01-01';
var endDate = '2012-01-08';
var jsonData = encodeURIComponent('select * from yahoo.finance.historicaldata where symbol in ("YHOO","AAPL","GOOG","MSFT") and startDate = "' + startDate + '" and endDate = "' + endDate + '"');
$.getJSON(url, 'q=' + data + "&env=http%3A%2F%2Fdatatables.org%2Falltables.env&format=json", callback);
data.addColumn('date', 'Date');
data.addColumn('number', 'Sold Pencils');
data.addColumn('string', 'title1');
data.addColumn('string', 'text1');
data.addColumn('number', 'Sold Pens');
data.addColumn('string', 'title2');
data.addColumn('string', 'text2');      //not on the fly
data.addRows([
[new Date(2008, 1 ,1), 30000, undefined, undefined, 40645, undefined, undefined],
[new Date(2008, 1 ,2), 14045, undefined, undefined, 20374, undefined, undefined],
[new Date(2008, 1 ,3), 55022, undefined, undefined, 50766, undefined, undefined],
[new Date(2008, 1 ,4), 75284, undefined, undefined, 14334, 'Out of Stock','Ran out of stock on pens at 4pm'],
[new Date(2008, 1 ,5), 41476, 'Bought Pens','Bought 200k pens', 66467, undefined, undefined],
[new Date(2008, 1 ,6), 33322, undefined, undefined, 39463, undefined, undefined]
]);
var chart = new google.visualization.AnnotatedTimeLine(document.getElementById('chart_div'));
chart.draw(data, {displayAnnotations: true});
}
</script>
</head>
<body>
//Note how you must specify the size of the container element explicitly!
<div id='chart_div' style='width: 700px; height: 240px;'></div>
</body>
Où est votre jQuery référence?
Êtes-vous importer jquery? ou d'une autre bibliothèque qui utilise $?
Sélectionnez 'jQuery' dans le menu déroulant sur la gauche de votre JsFiddle. Actuellement, il est Mootools...
S'il vous plaît apprendre comment utiliser jsFiddle: jsfiddle.net/pCK5q/2. Aussi, vous ne jamais définir callback n'importe où.
comment dois-je définir le callback alors?

OriginalL'auteur bouncingHippo | 2012-11-20