OpenStreetMapでバルーン表示してみた

OpenStreetMapってのは
誰でも自由に使用する事ができ、地図情報自体も編集できる地図です。

先日作成する勉強会に出てきたのですが実際地図も作ったりしてきました。
ちょっと地図使うサービスを作り始めていたので
せっかくなのでとOSMで地図表示してみる事にしました。

leafletとの出逢い
国内のブログを何個か見て「これは苦労するな」と感じました。
使用するJSにvar記述がなくて、変数等が
どのように管理されているかわからなかったからです。

jQueryライクな記述ができるようなプラグインはないかな？と
感じていて「下手すると作るか？」と思った時に「leaflef」に出逢いました。

マップ作成方法
まずHTMLに表示部分を準備します（サイズ等はお任せします）
view plainprint?
<div id="canvas"></div>  
<div id="canvas"></div>


その後JSで
view plainprint?
var map = L.map('canvas').setView([38.0,140.0],6)  
L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {  
    attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'  
}).addTo(map);  
        var map = L.map('canvas').setView([38.0,140.0],6)
        L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
            attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
        }).addTo(map);

setView()は中心の点です。次の引数がズーム率。
この場合日本がほぼ入る位の表示ですね。
2行目は著作権表示です。

これだけで表示されます！

バルーン(maker)を表示

私のサービスはTwitterで情報を拾う予定だったので
拾ってきた情報を表示させてみよう！って事になりました。
正直地図の表示だけだと、leafletは必要なかったんですけどね。

view plainprint?
var marker = L.marker([lat,lon]).addTo(map);  
marker.bindPopup(content);  
          var marker = L.marker([lat,lon]).addTo(map);
          marker.bindPopup(content);


これだけです＞＜。
座標を渡してあげて、マップを指定。
それにcontent(表示するHTML)を設定してあげたら、



という感じで表示されます。
本当に簡単です。

Go言語開発をVimで

Shizuoka.goという勉強会を立ち上げて、
静岡にGo言語旋風を巻き起こそうと考えていたのですが、
立ち上げた割に開発自体はあんまりしてないなぁって事で最近目下勉強中です。
当初Twitterクライアントを作っていたのですが、
必殺のOAuth周りを触って覚えようって事で自作OAuthライブラリも作りました。
※この辺りは後日

ちなみに勉強会をやるに当たって、
みなさん多いだろうって事でIntelliJIDEAを導入して開発していたのですが、
『Vimでやりたい！』という嬉しい声が上がったので
私の設定をブログで起こす事になりました。

ちなみにIntelliJを採用したのは、viのプラグインがある為で、
『LiteIDE』にviキーバインドがあればそっちに行くと思います。
QtにFakeVimというのがあって、それをコンパイルから行えば可能かは現在調査中です。
※この辺りもうまく行けば後日

基本設定
GoのSDKについているものを読み込ませます。
環境変数GOROOTはSDKを配置したパスです。

.vimrcファイルに
view plainprint?
set runtimepath+=$GOROOT/misc/vim  
set runtimepath+=$GOROOT/misc/vim

と追加します。
これによって『.go』ファイルがシンタックス表示されます。

コマンドモードで
view plainprint?
:Import net/http  
:Import net/http


とすればnet/httpのimport文を自動補完してくれます。
view plainprint?
:Fmt  
:Fmt

とやると『go fmt xxx.go』をやってくれます。
これがSDK内にあるのは嬉しい！

ただ私は
view plainprint?
auto BufWritePre *.go Fmt  
auto BufWritePre *.go Fmt

を追加して、ファイル保存時にfmtを勝手に行うようにしています。
これ実は各IDEに欲しくて、IntelliJのプラグインでやってくれる設定を
PullRequestしようかと考えているところです。

入力補完
まず環境変数GOPATHを設定します。
これはGo言語のライブラリ等を取ってきた時に配置される場所です。
それでhttp://github.com/nsf/gocodeのコードを取ってきます。

view plainprint?
go get github.com/nsf/gocode  
go get github.com/nsf/gocode

取得できたら、
view plainprint?
exe "set runtimepath+=".globpath($GOPATH, "src/github.com/nsf/gocode/vim")  
exe "set runtimepath+=".globpath($GOPATH, "src/github.com/nsf/gocode/vim")

を追加します。

これで、『.』の後にをタイプすれば、入力候補が出てきます。

色が気持ち悪いので
view plainprint?
hi Pmenu ctermbg=7  
hi PmenuSel ctermbg=4  
hi PMenuSbar ctermbg=8  
hi Pmenu ctermbg=7
hi PmenuSel ctermbg=4
hi PMenuSbar ctermbg=8

を設定しています。

私は『neocomplcache』を入れて『.』で自動的に入力候補を出してくれます。
NeoBundleを入れてやってます。

他の設定
私はプレゼンで使う事も多いので端末の文字が大きめなので
Goだとタブがきついので
view plainprint?
set tabstop=4  
set shiftwidth=4  
set softtabstop=4  
set tabstop=4
set shiftwidth=4
set softtabstop=4

を入れて少し幅を小さくしています。

プラグインのツリー表示を前に使ってたのですが、
最近パソコンがいかれたので、
折角なのでExモードでタブを使う用にしています。
『vim』ってだけ打つとExモードで立ち上がる設定
view plainprint?
function! s:GetBufByte()  
  let byte = line2byte(line('$') + 1)  
  if byte == -1  
    return 0  
  else  
    return byte - 1  
  endif  
endfunction  
autocmd VimEnter * nested if @% == '' && s:GetBufByte() == 0 | Ex | endif  
function! s:GetBufByte()
  let byte = line2byte(line('$') + 1)
  if byte == -1
    return 0
  else
    return byte - 1
  endif
endfunction
autocmd VimEnter * nested if @% == '' && s:GetBufByte() == 0 | Ex | endif


まぁこんな感じです。
本当にGo使う為だけに設定した.vimrcはこちら。

package main

import "fmt"

func main() {
    fmt.Println("%d",5)
}