[OSGeoJapan-discuss] leaflet.js zoom controlを拡大したいのですが。

Taro Matsuzawa taro @ georepublic.co.jp
2016年 11月 25日 (金) 21:55:27 PST


松澤です。

補足ですが、この手のスタイルが何かを調べるには
Firefoxなら開発ツールのインスペクタを、
Chromeならデベロッパーツールを、
Safariなら開発メニューのWebインスペクタを使って、
対象の要素(今回ならズームボタン)を選択すると
だいたいどのスタイルが影響しているかがわかりますので、
その上で必要な部分だけ上書きをすると良いです。
# 僕はこれらでどうしたら大きくなるかを弄って調べてからコードを書いてます

なお、IEにも同じようなツールがありますが、
普段使ってないので詳細は未確認です。

On 2016/11/26 14:10, Tetsuya Oba wrote:
> 大庭@TYSです。
>
> 松沢様、ありがとうございました。
>
> leaflet0.7.3でもうまくいきました。
> ボタンサイズは、leaflet-barだったんですね。
>
> ありがとうございました。
>
> 以 上
>
>
> On 2016/11/26 13:50, Taro Matsuzawa wrote:
>> 松澤です。
>>
>> Leaflet 1.0.2なのですが、
>> 下記スタイルシートを追加でいけました。
>> やってることはLeafletが元々用意しているCSSで
>> ボタンサイズに関わる部分だけ二倍に上書きをするというものです。
>> もちろん、leaflet.cssを読み込んだ後に読み込む必要があります。
>>
>> <style>
>>   /* button size 26px => 52px */
>>   .leaflet-bar a, .leaflet-bar a:hover {
>>     width: 52px;
>>     height: 52px;
>>     line-height: 52px;
>>   }
>>   /* radius value 4px => 8px */
>>   .leaflet-bar a:first-child {
>>     border-top-left-radius: 8px;
>>     border-top-right-radius: 8px;
>>   }
>>   .leaflet-bar a:last-child {
>>     border-bottom-left-radius: 8px;
>>     border-bottom-right-radius: 8px;
>>   }
>> </style>
>>
>>
>> On 2016/11/26 0:37, tys wrote:
>>> 日頃よりお世話になっています。
>>>
>>> 場違いの質問かもしれませんが。
>>>
>>> タブレットでHTML5+leaflet.jsを使って地質地図を表示しています。
>>>
>>> leafletでzoom out,zoom in のアイコン(?)が小さすぎて、
>>> タブレット上でタップしにくいとの指摘を受けています。
>>>
>>> 単純に2倍程度に拡大くしたいのですが、
>>> その方法が探し出せません。
>>>
>>> どのようにすれば、zoom out, zoom inの大きさを変更できるのでしょうか?
>>>
>>> よろしくお願いいたします。
>>>
>>> 以 上
>>>
>>>
>>>
>>>
>>> -----
>>> /****************************/
>>> 合同会社TYS
>>> 技術開発部
>>> 大庭哲哉
>>> http://www.disaster-software.net/
>>> http://blog.godo-tys.jp/
>>> /****************************/
>>> --
>>> View this message in context:
>>> http://osgeo-org.1560.x6.nabble.com/leaflet-js-zoom-control-tp5297437.html
>>>
>>> Sent from the OSGeo Japan Local Chapter mailing list archive at
>>> Nabble.com.
>>> _______________________________________________
>>> OSGeoJapan-discuss mailing list
>>> OSGeoJapan-discuss @ lists.osgeo.org
>>> http://lists.osgeo.org/mailman/listinfo/osgeojapan-discuss
>>>
>>
>>
>
>


-- 
Georepublic Japan Ltd.
c/o CommunityLink
5-3-1 Kumoidori, Chuo Ward
Kobe 651-0096

Taro Matsuzawa
Senior Developer

eMail: taro @ georepublic.co.jp
Web: https://georepublic.info

Tel: +81 (03) 6868 5418
Fax: +81 (03) 3374 0291


OSGeoJapan-discuss メーリングリストの案内