ホームページ >ウェブフロントエンド >jsチュートリアル >Jquery および html5_jquery に基づく 7 つのパーソナライズされた地図プラグイン

Jquery および html5_jquery に基づく 7 つのパーソナライズされた地図プラグイン

WBOY
WBOYオリジナル
2016-05-16 15:31:441187ブラウズ

1. HTML5 世界地図は世界を地域に分割し、国名を表示します

HTML5をベースにした世界地図アプリで、地図上で国ごとにエリアを分割し、マウスオーバーするとそのエリアに対応した国名が表示され、編集できるのが特徴です。 -up カスタム テキストとカスタム スタイル。

オンラインデモ ソースコードのダウンロード

2. jQuery ベクター SVG マップ プラグイン JVectorMap

JVectorMap は jQuery ベースのベクター マップ プラグインであり、他の jQuery マップ プラグインとは異なり、SVG 構造に基づいていますが、マップのズームやマップ プレーンなどの対応する機能もサポートしています。動き。 JVectorMap は jQuery に基づいているため、ほとんどの主流ブラウザをサポートし、広く使用されています。

オンラインデモ ソースコードのダウンロード

3. jQuery 中国地図プラグイン

今日は、比較的実用的な jQuery 中国地図プラグインを紹介します。この例では、中国全体の地図が各省に分割されており、対応する省の上にマウスをスライドすると、対応する省の詳細な紹介がポップアップ表示されます。 。

オンラインデモ ソースコードのダウンロード

4. マップホットスポットテキスト注釈プロンプトを実装するための純粋な CSS3

この地図アプリケーションの特徴は、地図上にマークされた点が多数あることです。マークされた点をクリックすると、ページ上にテキスト プロンプト ボックスが表示され、地図上のマークされた点の詳細情報が説明されます。アノテーション機能を備えた地図アプリケーションが必要な場合は、この CSS3 地図プラグインが最適です。

オンラインデモ ソースコードのダウンロード

5. HTML5 SVG 世界地図はドラッグして拡大できます

今日共有したい HTML5 地図アプリケーションは世界地図です。地図要素は SVG を使用して描画されており、地図をドラッグしたり部分的にズームしたりすることができます。その効果は非常に優れています。

オンラインデモ ソースコードのダウンロード

6. HTML5/CSS3 エリアマップ付きお問い合わせフォーム

今日は、さまざまなエリアを選択して対応する地図を表示し、そのエリアの問い合わせフォームに記入できる、より強力な HTML5/CSS3 問い合わせフォームを共有します。

オンラインデモ ソースコードのダウンロード

7. HTML5 3D 現実地図アニメーション、3D 効果はクールです

今日は、新しい HTML5 3D エフェクトを共有します。これは、現実の 3D マップです。この 3D マップは、現実の住宅や建物をキャプチャし、回転して表示することができます。これは非常に優れています。

オンラインデモ ソースコードのダウンロード

上記はいくつかの優れた jQuery/HTML5 マップ プラグインです。優れたマップ プラグインをお持ちの場合は、ぜひ共有してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。