Youtubeのあるキーワードの動画をGoogleMap上に表示し、そのMapをサイトに表示させたいと思っています。

回答ありがとうございます。
紹介いただいたURLはYOUTUBEの埋め込みコードからやっているのですが自分はAPIつかってやりたいと思っています！
そのAPIの部分でつまづいてしまってます。
http://gdata.youtube.com/feeds/api/videos?lr=ja&vq="+キーワード]+"&max-results=1&alt=json-in-script
とやってそのあとがわかりません。
http://q.hatena.ne.jp/1336747487
これのキーワード版と思って頂ければ！

varurl =http://gdata.youtube.com/feeds/api/videos?lr=ja&vq="+ loc.name +"&max-results=1&alt=json-in-script";
とやった場合のコールバック関数というのは
url.feed.entry.media$group.media$content.urlで正しいですか？
コールバック関数といったものをよく理解していなくてすいません。
ただこの場合はうまく動きません(>_<)

var List = [
{"latlng":[35.03937,135.72924],name:"金閣寺"},
{"latlng":[35.0270213,135.7982058],name:"銀閣寺"}
];
function initialize(){
//地図表示
var mapDiv = document.getElementById("map_canvas");
var mapCanvas = new google.maps.Map(mapDiv);
mapCanvas.setMapTypeId(google.maps.MapTypeId.ROADMAP);

//マーカーを表示・非表示する
mapCanvas.set("markersVisible", true);
var checkBox = document.getElementById("marker_visible");
google.maps.event.addDomListener(checkBox, "click", function(){
mapCanvas.set("markersVisible", Boolean(checkBox.checked));
});

//地図上にマーカ配置
var bounds = new google.maps.LatLngBounds();
var loc;
var i;
var lat;
for(i in List){
//マーカー作成
loc = List[i];
latlng = new google.maps.LatLng(loc.latlng[0], loc.latlng[1]);
var url="http://gdata.youtube.com/feeds/api/videos?lr=ja&vq="+ loc.name +"&max-results=1&alt=json-in-script";
var videoId = url.feed.entry.media$group.media$content.url;

bounds.extend(latlng);
var marker = createMarker(
mapCanvas, latlng, loc.name
);
createMarkerButton(marker);
}
mapCanvas.fitBounds(bounds);
}
function createMarker(map, latlng, title, videoId){
//マーカー作成
var marker = new google.maps.Marker({
position:latlng,
map:map,
title:title
});

//情報ウィンドウ
var infoWnd = new google.maps.InfoWindow({
content: '<iframe width="560" height="315" src="'+ videoId +'" frameborder="0" allowfullscreen></iframe>'
});

必要な部分はこれくらいかと。
http://techblog.yahoo.co.jp/javascript/jsonpjavascript/
これを参考にしているのですが初心者の私には理解できそうでできなくてもどかしいです(-_-;)