mapbox Mapbox Studio で作ったデータをJavascriptで受け取る

Javascript

Mapbox]]ではいろんなことができますが、[[Mapbox Studioで地図がカスタムできたり、地図上にマーカーやポリゴン、線が勝手に引けるのもMapboxの魅力の一つです。

ここでは、MapboxStudio マーカーを置くで作ったような、マーカーやポリゴンの情報を、ではMapbox GLを実装したWeb地図で、どのように取得するかを書いておきます。
(落とし穴もあったので…)

まず、ポリゴンやマーカーの位置情報は、基本的にDatasetsというものの中に入っています。

このわかりにくい、Mapbox API DocumentationのDatasetsを見てみましょう…。
https://www.mapbox.com/api-documentation/#datasets

まずですねー、

 "https://api.mapbox.com/datasets/v1/{username}?access_token=your-access-token"

でDatasetsのリストが取得できると書いてありますが、やってみると、Not foundになります…。

めげずに!!
datasetを指定して、取得する、というのをやってみます。

https://api.mapbox.com/datasets/v1/{username}/{dataset_id}?access_token=your-access-token”

ここで、2つ目の罠が!
このdataset_idというのは、Mapbox Studioの中の、Datasetの画面の次の部分に書かれています。
最初、名前とかかと思ってたw

&ref(dataset_id.png);

すると、レスポンスがJSONで帰ってきます。
全体的なサンプルコードを掲載しておきます。

 function getDatasets(){
 	
 	var dataset_id = "hogehoge";
 	
        var url ="https://api.mapbox.com/datasets/v1/hogehogecompany/" + dataset_id + "?access_token=" + mapboxgl.accessToken;
 
        var xmlhttp = new XMLHttpRequest();	
 	
        xmlhttp.onreadystatechange = function() {
 		    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
 		    	
 		        var result = JSON.parse(xmlhttp.responseText);
 		    
 		    }else{
 		    	
 		    	$("#result").text("指定のデータは存在しません");
 		    }
 	
 		}
 	
 	xmlhttp.open("GET", url, true);
 	xmlhttp.send();
      	
 }

linux iptablesを設定する

Linuxサーバー

基本的なiptablesの設定方法です

すべてのチェインの中身を削除する

 /sbin/iptables -K

ユーザー定義チェインを削除する

 /sbin/iptables -X
 /sbin/iptables -A INPUT -i lo -j ACCEPT
 /sbin/iptables -A INPUT -p icmp --icmp-type any -j ACCEPT
 /sbin/iptables -A INPUT -p 50 -j ACCEPT
 /sbin/iptables -A INPUT -p 51 -j ACCEPT
 /sbin/iptables -A INPUT -p udp --dport 5353 -d 224.0.0.251 -j ACCEPT
 /sbin/iptables -A INPUT -p udp -m udp --dport 631 -j ACCEPT
 /sbin/iptables -A INPUT -p tcp -m tcp --dport 631 -j ACCEPT
 /sbin/iptables -A INPUT -m state --state ESTABLISHED,RELATED -j ACCEPT
 /sbin/iptables -A INPUT -m state --state NEW -m tcp -p tcp --dport 20 -j ACCEPT
 /sbin/iptables -A INPUT -m state --state NEW -m tcp -p tcp --dport 21 -j ACCEPT
 /sbin/iptables -A INPUT -m state --state NEW -m tcp -p tcp --dport 22 -j ACCEPT
 /sbin/iptables -A INPUT -m state --state NEW -m tcp -p tcp --dport 10022 -j ACCEPT
 /sbin/iptables -A INPUT -m state --state NEW -m tcp -p tcp --dport 25 -j ACCEPT
 /sbin/iptables -A INPUT -m state --state NEW -m tcp -p tcp --dport 80 -j ACCEPT
 /sbin/iptables -A INPUT -m state --state NEW -m tcp -p tcp --dport 443 -j ACCEPT
 /sbin/iptables -A INPUT -m state --state NEW -m tcp -p tcp --dport 4949 -j ACCEPT
 /sbin/iptables -A INPUT -m limit --limit 1/s -j LOG --log-prefix "[IPTABLES INPUT] : "
 /sbin/iptables -A INPUT -j REJECT --reject-with icmp-host-prohibited

設定の確認

 # iptables -L
 Chain INPUT (policy ACCEPT)
 target     prot opt source               destination
 ACCEPT     all  --  anywhere             anywhere
 ACCEPT     icmp --  anywhere             anywhere            icmp any
 ACCEPT     udp  --  anywhere             224.0.0.251         udp dpt:mdns
 ACCEPT     udp  --  anywhere             anywhere            udp dpt:ipp
 ACCEPT     tcp  --  anywhere             anywhere            tcp dpt:ipp
 ACCEPT     all  --  anywhere             anywhere            state RELATED,ESTABLISHED
 ACCEPT     tcp  --  anywhere             anywhere            state NEW tcp dpt:ftp-data
 ACCEPT     tcp  --  anywhere             anywhere            state NEW tcp dpt:ftp
 ACCEPT     tcp  --  anywhere             anywhere            state NEW tcp dpt:ssh
 ACCEPT     tcp  --  anywhere             anywhere            state NEW tcp dpt:10022
 ACCEPT     tcp  --  anywhere             anywhere            state NEW tcp dpt:smtp
 ACCEPT     tcp  --  anywhere             anywhere            state NEW tcp dpt:http
 ACCEPT     tcp  --  anywhere             anywhere            state NEW tcp dpt:https
 ACCEPT     tcp  --  anywhere             anywhere            state NEW tcp dpt:munin
 LOG        all  --  anywhere             anywhere            limit: avg 1/sec burst 5 LOG level warning prefix `[IPTABLES INPUT] : '
 REJECT     all  --  anywhere             anywhere            reject-with icmp-host-prohibited
 
 Chain FORWARD (policy ACCEPT)
 target     prot opt source               destination
 
 Chain OUTPUT (policy ACCEPT)
 target     prot opt source               destination
 

設定内容を保存します

 service iptables save

iptablesを再起動します

 service iptables restart

lessを利用して、長い結果を見やすく表示

Linuxサーバー

lessを利用して、長い結果を見やすく表示

コマンドの結果が、大量にあると、一画面の中に表示できずに切れてしまいますよね。

 //例
 # yum list installed

そんな時は|lessを利用すると、快適に見ることができます。

 //例
 # yum list installed|less

結果を一行ずつスクロールするにはeを押します。
1ページごと進みたい場合は、fを押します。

http://www.k4.dion.ne.jp/~mms/unix/linux_com/less.html

jqueryなどライブラリをGoogleから呼び出す

Ajax
Javascript
Googleツール

jqueryなどライブラリをGoogleから呼び出す

jqueryやdojo,yui,prototype.jsなどライブラリをGoogleから呼び出すと、いちいちダウンロードして自社のサーバーに設置しなくてよいので、便利です。
これをGoogle Libraries APIと呼びます。

最近では、一度Googleのライブラリを読み込めば、後は関数で各ライブラリを呼び出せるので、さらに便利です。

以下、手順です。

  1. APIキーを取得します。下記のサイトへ行って、埋め込みたいサイトのURLを入力します。

http://code.google.com/apis/loader/signup.html

  1. 入手したAPIキーを、下記のコードのINSERT-YOUR-KEYと置き換えます。
  2.  <script type="text/javascript" src="https://www.google.com/jsapi?key=INSERT-YOUR-KEY"></script>
    
    1. そのあとは、呼び出したいライブラリを、次のように呼び出しましょう。
    2.  //jQueryの1.6.2を呼び出したい場合
       google.load("jquery", "1.6.2");
      

      詳しくは、公式ページで。
      http://code.google.com/apis/libraries/devguide.html

jqueryとprototype.jsの競合を避ける

Ajax

jQuery と prototype.jsやMooTools, or YUIなどの他のライブラリを一緒に使おうとすると、コンフリクトして使えません。[sad]

理由は、jQueryは”$”を”jQuery”のショートカットとして使っているからです。

[参照]
http://docs.jquery.com/Using_jQuery_with_Other_Libraries

回避方法で、私が一番簡単だと思う方法をご紹介します。

  1. 他のライブラリより先にjQueryを読み込みます。
  2. jQueryとほかのライブラリを読み込んだあと、
     jQuery.noConflict();

を呼び出します。

  1. jQueryを使用するスクリプトの中の、”$”を”jQuery”に書き換えます。
  • まさに prototype.js と競合していて、うまく動作していない部分があったので、助かりました。 — 通りすがり {2009-11-04 (水) 01:24:49}