2020-01

マップ

【マップ】Googleマップのルート表示

Google Maps APIを利用して表示するGoogleマップで、スタート地点からゴール地点までのルートを表示します。

マップ

【マップ】Googleマップのマーカーのサイズと表示位置を調整

Google Maps APIを利用して表示するGoogleマップで、オリジナル画像で設定したマーカーのサイズを縮小し、表示位置を通常よりも25pxだけ上に移動します。

マップ

【マップ】Googleマップのデザイン変更

Google Maps APIを利用して表示するGoogleマップで、マーカーを目立たせるために地図のデザインを変更します。地図全体をグレースケールにして、地図上の観光スポット、施設、学校、公園等は非表示にします。

マップ

【マップ】Googleマップにオリジナル画像を重ねて表示

Google Maps APIを利用して表示するGoogleマップで、オリジナル画像を地図に重ねて表示します。マーカーは地図を拡大・縮小しても同じ大きさですが、重ねたオリジナル画像は地図の拡大・縮小に対応します。

マップ

【マップ】Googleマップのマーカーをクリックして情報ウィンドウを表示

Google Maps APIを利用して表示するGoogleマップで、マーカーをクリックして情報ウィンドウを表示する動作を実装します。

マップ

【マップ】Googleマップの各種コントローラーの設定

Google Maps APIを利用して表示するGoogleマップで、各種コントローラーの表示・非表示の設定をします。

マップ

【マップ】Googleマップのマーカーをオリジナル画像に変更

Google Maps APIを利用してWebサイトに地図を埋め込み、オリジナル画像のマーカーを配置します。

フォーム

【フォーム】ラジオボタンとチェックボックスで複合的に絞り込み検索

ラジオボタンとチェックボックスを使って複合的にコンテンツの絞り込み検索をします。絞り込み検索の条件はラジオボタンとチェックボックスのvalue属性と、コンテンツのdivタグのカスタムデータ属性の一致です。

タイトルとURLをコピーしました