-3
私はHTMLとJavaScriptにはまったく新しいので、すぐに最終プロジェクトがあり、OSMと私からいくつかのデータを呼び出そうとしていますすべてのヘルプクラスの初心者向けプログラミング、「位置0のJSONで予期しないトークン」を受け取ります
<html>
<head>
<style>
body {background-color: #C70039;}
h1 {text-align: center;}
h1 {color: #FFFFFF;}
h1 {font-family: Georgia
font-style:normal;
font-weight: bold;}
h2 {text-align: center;}
h2 {color: #FFFFFF;}
h2 {font-family: Georgia
font-style: italic;
font-weight: normalc;}
div {border-style: outset;
border-color: #000000;
border-width: 3px;
}
</style>
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet/v0.7.7/leaflet.css" />
</head>
<body>
<h1> Temple University Main Campus Map </h1>
<h2>Use this map to find your way around Temple University Main Campus in Philadelphia </h2>
<div id="tumap" style="height:900px; width:1300px; margin:auto"></div>
<script src="http://cdn.leafletjs.com/leaflet/v0.7.7/leaflet.js"></script>
<script>
var tumap = L.map('tumap').setView([39.981450,-75.154386], 17);
L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token={accessToken}', {
attribution: 'Contributors Elijah Diaz-Cruz, Jodie Spross, Laura Trzaska & Taryn Weisberg',
maxZoom: 18,
id: 'jspross93.0d4ecll6',
accessToken: 'pk.eyJ1IjoianNwcm9zczkzIiwiYSI6ImNpcGVtcXo3cTAwMDFzdG5jc2lxdnN1NmEifQ.8-EK8kM2Apv_vSawAqfw0g'
}).addTo(tumap);
//function onEachFeature(feature, layer) {
// if (feature.properties && feature.properties.popupContent) {
// layer.bindPopup(feature.properties.popupContent);
//for when we are ready with the feature
// }
//};
var xhr = new XMLHttpRequest();
xhr.open("GET", "http://overpass-api.de/api/xapi?map?bbox=-75.16196,39.97636,-75.14511,39.98475", false);
xhr.send();
var myJsonDictionary = JSON.parse(xhr.responseText);
L.geoJson(myJsonDictionary, {onEachFeature: onEachFeature}).addTo(tumap);
</script>
</body>
</head>
</html>
：http://gus8068sum16.github.io/FinalGroupProject.html
そして、これはこれまでのところ私のコードです：ここでは
「位に0でJSONに予期しないトークン<」は、これまでのマップへのリンクです。このエラーを取得しておきます大いに感謝されるだろう
EDIT：私の目標は、OSMからノードデータを取得し、いくつかの機能は、キャンパス内のすべての建物や道路の輪郭を取得し、私はその後、ポップアップを追加して、「oneachfeature」を使用してこのようなことができたことです – jspross93
あなたが理解する必要がありますこれを行うためのAJAXの基礎、そしてもしあなたが「すぐに」そうなら、あなたには申し訳ありません。しかし、あなたが気にする主な問題は、サーバーへのリクエストはJSONデータファイルを返さないため、
Dellirium
私たちの教授はAJAXについて言及したことは一度もないので、私たちはAJAXなしでこのプロジェクトを行うことが期待されています。私たちはある種の「火に投げ込まれた」ので、このクラスでは以前のコーディング知識が全くないと話しました。コードを動作させる例がありますか？ – jspross93