地図が簡単に楽しく作成できる!世界地図をはじめ、日本を含めた各国の地図にも対応 -Pixel Map Generator
デモページ 2 Japan Mapの使い方 Step 1: 外部ファイル jquery.jsと当スクリプトを外部ファイルとして記述します。 <head> ... <script src="https://code.jquery.com/jquery-2.1.1.js"></script> <script src="jquery.japan-map.min.js"></script> </head> Step 2: HTML 日本地図を配置するdivをセットします。 <body> ... <div id="map-container"></div> ... </body> Step 3: JavaScript jQueryのセレクタで配置する場所を指定し、スクリプトを実行します。 <script> $(function(){ $("#map-container").japanMap({ on
最近はスマホ対応サイトがだいぶ増えてきたけれど、PC版にはある地図情報を省略しているサイトが多い。 だが、ユーザーの行動を考えた場合、会社や会場のロケーションの確認は、移動中に行われる可能性が最も高い。このためPCサイトで地図を表示していながら、スマホ版では地図を表示しない・・・というのは、ユーザーのアクションを阻害してしまう。 実際、出先で会社の場所を調べようとしても、住所や地図にアクセスできない企業サイトはかなり多い。実生活でも困る事がしばしば。 ユーザー中心で考えた場合、階層が深くてもいいのでスマホ版にも、住所、電話番号、地図などはしっかり載せる方が良いと思う。一般論としての「スマホ対応サイトは情報を絞るべき」は正しいが、どの情報を削るべきかが精査するのは中々難しいなぁと思うなど。 適切なタイミングで適切な情報にアクセスできないならば、PCサイトだけのほうがユーザー体験は高くなってし
サービス終了のお知らせ NAVERまとめは2020年9月30日をもちましてサービス終了いたしました。 約11年間、NAVERまとめをご利用・ご愛顧いただき誠にありがとうございました。
地図のような大きい画像を指定サイズにクリップし、クリックやドラッグ操作でスムーズにスクロールさせるjQueryのプラグインを紹介します。 CraftMap [ad#ad-2] CraftMapのデモ CraftMapの実装 CraftMapのデモ デモは二つあり、ページ内の一部に配置したものとウインドウいっぱいに配置したものがあります。 地図のスクロール方法は3種類の操作が可能です。 ナビゲーション(左のパネル)の各ラベルをクリック 地図上のマーカーをクリック 地図をドラッグ 各ラベル・マーカーをクリックすると、それに対応した付加情報をパネルで表示します。 Demo 2: ウインドウいっぱいに配置 [ad#ad-2] CraftMapの実装 外部ファイル 「jquery.js」と当スクリプトを外部ファイルとして指定します。 <script src="js/jquery.js" type="
使いやすそうだったので備忘録。 Googleマップライクに動かせて マーキング、その場にコンテンツ を表示させる事も可能な軽量 jQueryプラグイン・CRAFTMAPです。 ちょっと説明下手ですね・・ マーキングもデザインのカスタマイズも割と楽で色々なものに応用できそうです。商用は有料なのですが、もしかしたら使うかも。 メニューから選択するだけでなく、ドラッグ可能でマーカーをクリックすることでもスクロールしてくれます。地図コンテンツでたまに見かけるインターフェースですね。 特にGoogle Map API等は使用していません。シンプルに、地図の画像を作って、座標に応じてマーカーを設置する、というものです。ライブラリも軽量ですよ。 サンプル作ったのでどうぞ。 Sample コード <script type='text/javascript' src='https://ajax.google
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く