読者です 読者をやめる 読者になる 読者になる

【WordPress】地図表示プラグインGeo Mashupの地図をドラッグ禁止にした

自分用覚書きです。(何かあってもいかなる責任を負いかねます)

iPhoneで触るとGoogleマップがぬるぬる動いて困る

旅行ブログ:TIKIKITI.JPWordPressの記事にジオタグをくっつけて地図を表示する「Geo Mashup」を使っているのですが、iPhoneスマホ)で見たときに、親指がGoogleマップを触ることでGoogleマップを動かしちゃう。

あの現象なんていうの、アメリカのアニメーションで「走っても走っても絨毯が動くだけで全然進まない!」みたいなやつあるけどまさにあれ。

設定でいけるかと思ったけどわからなかったので、思い切ってコード書き足した。(力技すぎてごめん)

プラグインを直書きで編集

ここから先は自己責任です。

編集対象はこれ、「geo-mashup/js/mxn/mxn.googlev3.core.js」です。

124行目くらいのこいつに書き足す。

   applyOptions: function(){
        var map = this.maps[this.api];
        var myOptions = [];
        if (this.options.enableDragging) {
            myOptions.draggable = false;
        } 
        else{
            myOptions.draggable = false;
        }
        if (this.options.enableScrollWheelZoom){
            myOptions.scrollwheel = true;
        } 
        else{
            myOptions.scrollwheel = false;
        }
        if(this.options.disableDoubleClickZoom){
            myOptions.disableDoubleClickZoom = true;
        }
        else{
            myOptions.disableDoubleClickZoom = false;
        }
        map.setOptions(myOptions);
    },

enableScrollWheelZoomがfalseのときに、draggableもfalseを無理矢理設定する。

   applyOptions: function(){
        var map = this.maps[this.api];
        var myOptions = [];
        if (this.options.enableDragging) {
            myOptions.draggable = false;
        } 
        else{
            myOptions.draggable = false;
        }
        if (this.options.enableScrollWheelZoom){
            myOptions.scrollwheel = true;
        } 
        else{
            myOptions.scrollwheel = false;
            myOptions.draggable = false;
        }
        if(this.options.disableDoubleClickZoom){
            myOptions.disableDoubleClickZoom = true;
        }
        else{
            myOptions.disableDoubleClickZoom = false;
        }
        map.setOptions(myOptions);
    },

これで設定画面でEnable Scroll Wheel Zoomにチェックを入れない限り、Googleマップがぬるぬる誤作動することがないです。

デメリット

各記事の編集画面でジオタグつける地図もドラッグできなくなる。ぬるぬるとトレードオフ