2016-06-25 10 views
-2

私は緯度と経度のテーブルと関連するデータを持つMySQLデータベースを持っています。私はGoogle Mapを作成しようとしており、JavaScriptを使用してJSON文字列を解析したいと考えています。私はここやYouTubeで見てきました。私が間違っていることを解決する方法はわかりません。ここでJavaScriptを使用したJSON配列の解析

は、私は私のecho文を取得する私のJSON文字列である:ここで

{"cm_mapTABLE":[["1","Angels Rest Photos OR","Angels_Rest_Photos_OR","663","aaj.jpg","2","Angel's Rest","Hike one of the trails in the Gorge with a scenic overlook, stream, and waterfall.","0","blue","4.5","45.5603","-122.171","http:\/\/www.eyehike.com\/pgallery\/index.php?\/category\/6","Angels_Rest_Photos_OR\/aae.thumb.jpg\" ALIGN=left HEIGHT=115 WIDTH=150>","http:\/\/www.eyehike.com\/pgallery\/i.php?\/galleries\/Angels_Rest_Photos_OR\/aaj-th.jpg","","","",""],["2","Ape Canyon Photos WA","Ape_Canyon_Photos_WA","681","PICT0114.jpg","3","Ape Canyon Trail","This trail is popular with hikers and mountain bikers with great views of several mountains.","0","blue","11","46.1653","-122.092","http:\/\/www.eyehike.com\/pgallery\/index.php?\/category\/8","Ape_Canyon_Photos_WA\/PICT0114.thumb.jpg\" ALIGN=left HEIGHT=115 WIDTH=150>","http:\/\/www.eyehike.com\/pgallery\/i.php?\/galleries\/Ape_Canyon_Photos_WA\/PICT0114-th.jpg","","","",""]]} 

は私のコードです:

<!DOCTYPE html> 
<head> 
<?php 
require("phpsqlsearch_dbinfo.php"); // This is the file with your logon info 

//$host="localhost"; //replace with your hostname 
//$username="root"; //replace with your username 
//$password=""; //replace with your password 
//$db_name="$database"; //replace with your database 
$con=mysqli_connect("$hostname", "$username", "$password", "$database")or die("cannot connect"); 
//mysqli_select_db("$db_name")or die("cannot select DB"); 
$sql = "select * from location_markers WHERE mrk_id < 3"; //replace emp_info with your table name 
$result = mysqli_query($con, $sql); 
$json_string_data = array(); 
if(mysqli_num_rows($result)){ 
    while($row=mysqli_fetch_row($result)){ 
     $json_string_data['cm_mapTABLE'][]=$row; 
    } 
} 
mysqli_close($con); 

// You have to give the json a name to make it accessible by JS, e.g.: 
// echo 'file='.json_encode($json_string_data),';'; 

// This statement will echo the json output in the displayed web page 
echo json_encode($json_string_data); 
// please refer to our PHP JSON encode function tutorial for learning json_encode function in detail 
?> 
</head> 
<body> 
    <script> 
    for (i = 0;i < $json_string_data.length;i++){ 
    var javascript_string_data=<?php echo json_encode($json_string_data); ?>; 
     document.write(cm_mapTABLE.rank[i]); 
    } 
     </script> 
</body> 
</html> 

私はFirebugのを使用していますし、ここでエラーです:

は、

ReferenceError: $json_string_data is not defined

for (i = 0;i < $json_string_data.length;i++){

JSON文字列の要素を参照する正しい方法を教えてください。私は何とかJSON文字列のフィールド名を取得する必要がありますか?

答えて

1

var javascript_string_data=<?php echo json_encode($json_string_data); ?>;は、オブジェクトを含む変数javascript_string_dataを形成しています。

実際にwindowオブジェクトのプロパティと見なされるcm_mapTABLE.rank[i]にアクセスしようとしています。

は、以前のデータベースに保存された外部データに依存するとき、直接JSON文字列を代入すると、セキュリティ上の問題につながる可能性があることに注意してください

document.write(javascript_string_data.cm_mapTABLE.rank[i]); 

出力してみてください。代わりにJSON.parse()メソッドを使用してください。

さらにJavaScriptループでPHP変数を使用しようとしています。

は、ループの中でそれを使用して前に、JavaScript変数を定義します。

var javascript_string_data = JSON.parse('<?echo json_encode($json_string_data); ?>'); 
for (i = 0 ; i < json_string_data.length ; i++){ 
    document.write(javascript_string_data.cm_mapTABLE.rank[i]); 
} 
+0

注意:文字列ではなくオブジェクトを使用し、コードが 'JSON.parse'に変更されているため、' str_replace'が編集によって削除されました。 –

+0

ありがとうございました。インターネットでJSON形式の文字列を検索し、JSON出力を貼り付けることができるサイトを見つけました。フォーマットされているので、今後の投稿に使用します。私は今晩JSON解析を使用します。私はGoogleのスプレッドシートに基づいて再び私の古いGoogleマップV2を使用しているので、私はいくつかの呼吸ルームを持っている。 – Steve

+0

私の最終的なコードでは、mysqlデータを取得するために使用しています。 JSONの代わりにXMLを使用した例が見つかりました。 – Steve

0

注意をmysqlのは非推奨とMySQLデータベースへのクエリはmysqliのである必要がされていること。 mysqliクエリでは、データベースを含める必要があります。あなたのホストのPHP管理ページでデータベース名を見つけることができます。鉱山はphpmyadminにログオンし、 "データベース"を選択し、次にリストを見て、データベースのリストに表示されているとおりにデータベースを入力することで見つけられます。あなたはただ一つのデータベースを持っているかもしれません。

<?php 
// The next file has information for $hostname, $username, $password, $database 
require_once("phpsqlsearch_dbinfo.php"); 

// Start XML file, create parent node 

$dom = new DOMDocument("1.0"); 
$node = $dom->createElement("markers"); 
$parnode = $dom->appendChild($node); 

// Opens a connection to a MySQL server 
    $connection=new mysqli($hostname, $username, $password, $database); 
if ($connection->connect_error) die($connection->connect_error); 

// Select all the rows in the markers table 

$query = "SELECT * FROM markers 
     WHERE 1 
     ORDER BY rank, name"; 
$result = $connection-> query($query); 
if (!$result) die($connection->error); 

$rows = $result->num_rows; 

header("Content-type: text/xml"); 

// Iterate through the rows, adding XML nodes for each 
for ($j = 0 ; $j < $rows ; ++$j){ 
    $result->data_seek($j); 
    $row = $result->fetch_array(MYSQLI_ASSOC); 

    // ADD TO XML DOCUMENT NODE 
    $node = $dom->createElement("marker"); 
    $newnode = $parnode->appendChild($node); 
    $newnode->setAttribute("mrk_id",$row['mrk_id']); 
    $newnode->setAttribute("name",$row['name']); 
    $newnode->setAttribute("rank", $row['rank']); 
    $newnode->setAttribute("mileage", $row['mileage']); 
    $newnode->setAttribute("address", $row['address']); 
    $newnode->setAttribute("lat", $row['lat']); 
    $newnode->setAttribute("lng", $row['lng']); 
    $newnode->setAttribute("marker_type", $row['type']); 
    $newnode->setAttribute("mcolor", $row['mcolor']); 
    $newnode->setAttribute("permalink", $row['permalink']); 
    $newnode->setAttribute("photolink", $row['photolink']); 
    $newnode->setAttribute("routelink", $row['routelink']); 
    $newnode->setAttribute("thumbnail", $row['thumbnail']); 
} 

echo $dom->saveXML(); 

$result->close(); 
$connection->close(); 
?> 

Here is the first 5 mysql records output from this code: 
<markers> 
<marker mrk_id="1" name="Bench Lake/Snow Lake" 
rank="1" mileage="2.5" address="" lat="46.7678" 
lng="-121.707" marker_type="" mcolor="blue" 
permalink="https://www.eyehike.com/2016/bench-lake-snow-lake-wa/" 
photolink="http://www.eyehike.com/pgallery/index.php?/category/344" 
routelink="http://www.eyehike.com/pgallery/index.php?/category/345" 
thumbnail="http://www.eyehike.com/pgallery/i.php?/galleries/Snow_Lake_Photos_WA/aai-th.jpg" 
/> 
<marker mrk_id="2" name="Benham Falls" rank="1" 
mileage="0.4" address="" lat="43.939" 
lng="-121.414" marker_type="" mcolor="blue" 
permalink="https://www.eyehike.com/2016/benham-falls-or/" 
photolink="http://www.eyehike.com/pgallery/index.php?/category/25" 
routelink="http://www.eyehike.com/pgallery/index.php?/category/26" 
thumbnail="http://www.eyehike.com/pgallery/i.php?/galleries/Benham_Falls_Photos_OR/aaa-th.jpg" 
/> 
<marker mrk_id="3" name="Big Creek Falls" 
rank="1" mileage="1.6" address="" lat="46.0931" 
lng="-121.908" marker_type="" mcolor="green" 
permalink="https://www.eyehike.com/2016/big-creek-falls-wa/" 
photolink="http://www.eyehike.com/pgallery/index.php?/category/27" 
routelink="http://www.eyehike.com/pgallery/index.php?/category/28" 
thumbnail="http://www.eyehike.com/pgallery/i.php?/galleries/Big_Creek_Falls_Photos_WA/aac-th.jpg" 
/> 
<marker mrk_id="4" name="Burnt Bridge Creek" 
rank="1" mileage="6" address="" lat="45.6361" 
lng="-122.579" marker_type="" mcolor="blue" 
permalink="https://www.eyehike.com/2016/burnt-bridge-creek-trail-wa/" 
photolink="http://www.eyehike.com/pgallery/index.php?/category/35" 
routelink="http://www.eyehike.com/pgallery/index.php?/category/36" 
thumbnail="http://www.eyehike.com/pgallery/i.php?/galleries/Burnt_Bridge_Creek_Photos_WA/aaq-th.jpg" 
/> 
<marker mrk_id="5" name="Cape Falcon Trail" 
rank="1" mileage="7" address="" lat="45.7631" 
lng="-123.956" marker_type="" mcolor="blue" 
permalink="https://www.eyehike.com/2016/cape-falcon-or/" 
photolink="http://www.eyehike.com/pgallery/index.php?/category/39" 
routelink="http://www.eyehike.com/pgallery/index.php?/category/40" 
thumbnail="http://www.eyehike.com/pgallery/i.php?/galleries/Cape_Falcon_Photos_OR/aae-th.jpg" 
/> 
</markers> 
関連する問題