WordPressにGoogle Maps API V3！

CREATE TABLE JSON1 (
id int(11) NOT NULL auto_increment,
lat decimal(10,6) NOT NULL default’0.000000′,
lng decimal(10,6) NOT NULL default’0.000000′,
html varchar(255) NOT NULL default “,
label varchar(255) NOT NULL default “,
PRIMARY KEY (id)
) TYPE=MyISAM

◆インポートさせるデータのテキストファイル「*.txt」を作成

1;35.714559;139.517698;<a href=”http://waotabi.web.fc2.com/kouen/tokyo-koganei.html” target=”_blank”>詳細リンク</a>;小金井公園

2;35.763940;139.384980;<a href=”http://waotabi.web.fc2.com/kouen/tokyo-noyamakita.html” target=”_blank”>詳細リンク</a>;野山北・六道山公園

3;35.676495;139.491963;<a href=”http://waotabi.web.fc2.com/kouen/tokyo-fuchumori.html” target=”_blank”>詳細リンク</a>;府中の森公園

4;35.656227;139.473656;<a href=”http://waotabi.web.fc2.com/kouen/tokyo-fuchuukyoudounomori.html” target=”_blank”>詳細リンク</a>;府中市郷土の森

5;35.63740;139.46047;<a href=”http://waotabi.web.fc2.com/kouen/tokyo-sakuragaoka.html” target=”_blank”>詳細リンク</a>;都立桜ヶ丘公園

6;35.682294;139.524779;<a href=”http://waotabi.web.fc2.com/kouen/tokyo-nogawa.html” target=”_blank”>詳細リンク</a>;都立野川公園

7;35.960831;139.850614;<a href=”http://waotabi.web.fc2.com/chiba-shimizu.html” target=”_blank”>詳細リンク</a>;清水公園

◆MySQLにテキストファイルをインポート

◆MySQLからJSON形式ファイルを生成するためのphpファイルを作成

<?php

include(“mysql2json.class.php”);

//MySQL接続設定

define(“DBSV”, “サーバ名“);

define(“DBNAME”, “データベース名“);

define(“DBUSER”, “ユーザ“);

define(“DBPASS”, “パスワード“);

//MySQL接続

$conn = mysql_connect(DBSV, DBUSER, DBPASS) or die();

mysql_query(“SET NAMES utf8″,$conn);

mysql_select_db(DBNAME, $conn);

//SQLの発行

$num=0;

$sql = “SELECT * FROM JSON1“;

$result = mysql_query($sql, $conn);

$num=mysql_affected_rows();

//JOSNファイル生成

$objJSON=new mysql2json();

print(trim($objJSON->getJSON($result,$num)));

?>

◆ブラウザで上記phpファイルにアクセスして、JSON形式ファイルが生成されているか確認

http://waox.main.jp/news/maps/googlemapsapi/example/json1-demo.php

{ “data”: [ { “id” : “1”, “lat” : “35.714559”, “lng” : “139.517698”, “html” : “詳細リンク“, “label” : “小金井公園” }, { “id” : “2”, “lat” : “35.763940”, “lng” : “139.384980”, “html” : “詳細リンク“, “label” : “野山北・六道山公園” }, { “id” : “3”, “lat” : “35.676495”, “lng” : “139.491963”, “html” : “詳細リンク“, “label” : “府中の森公園” }, { “id” : “4”, “lat” : “35.656227”, “lng” : “139.473656”, “html” : “詳細リンク“, “label” : “府中市郷土の森” }, { “id” : “5”, “lat” : “35.637400”, “lng” : “139.460470”, “html” : “詳細リンク“, “label” : “都立桜ヶ丘公園” }, { “id” : “6”, “lat” : “35.682294”, “lng” : “139.524779”, “html” : “詳細リンク“, “label” : “都立野川公園” }, { “id” : “7”, “lat” : “35.960831”, “lng” : “139.850614”, “html” : “詳細リンク“, “label” : “清水公園” } ] };

◆最後にGoogle Maps APIで活用

スポンサードリンク