問題タブ [leaflet]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - Leafletポップアップのクリックイベントにバインドできません
Leafletを使用して地図を描画しています。ポップアップ内に、より詳細な説明につながるリンクを追加しました。説明は地図から分離され、アコーディオンを使用してリストに配置されるため、すべての説明が非表示になります。
アンカーを使用してアコーディオンコンテンツにリンクすることはできますが、JavaScriptを実行する必要があるため、イベントハンドラーonclick
を追加しようとしています。これは機能しません。click
これが私のコードです:
JSFiddleで確認できます
これをgithubのバグとしてこことここのLeafletの開発者に報告しましたが、彼はバグを閉じて、問題ではなく、別の問題を使用できると返信しましたclass
。これは機能しません。
編集:私も自分でいくつか見つけました:http://jsfiddle.net/M5Ntr/12/ しかし、まだ問題があり、500ポイントになる可能性があるので、コードをできるだけ少なくしたいと思います、関数を作成しようとしましたが、変数を渡すことができません:(
これは機能しています
しかし、これは望ましいです(機能していません):
あるいは
これは.on('click')または同様の内部で実行されます...
javascript - マップからポリゴンを削除
要件: リーフレット js マップ API を使用して、顧客がマーカーをクリックすると、マーカーのすぐ下に長方形が描画され、マーカーに従って中央に配置される必要があります。次に、別のマーカーをクリックすると、以前の長方形が削除され、新しくクリックされたマーカーの下に別の長方形が描画されます。
問題: 以下のコードを使用して多角形を描画すると、長方形が表示されます。そして、マーカー上に長方形を描画します。次に、別のマーカーをクリックすると、新しい長方形が描画されます。しかし、古い長方形もまだ存在します。
質問: 新しいマーカーをクリックすると、古い四角形がマップから削除されるようにするには、どのように動作を実装すればよいですか?
php - ブートストラップヒーロー-ユニットの高さ-リーフレット
ナビゲーションバーとサイドバー(スパン3)+マップ(スパン9)を備えた基本的なブートストラップレイアウトがあります。私の問題は、ブラウザでこのコードを見ると、マップが次のようになっていることです。http: //dl.dropbox.com/u/15923835/bootstr.jpg
しかし、マップのサイズを固定したい(ページの80%をカバーする必要があります。すべてのDIVで固定の高さを設定しようとしましたが、何も起こりません。何か提案はありますか?
私の悪い技術的説明でごめんなさい(私は学ぼうとしています)
コードのコピーは次のとおりです。
javascript - リーフレットポップアップでhtml形式でcsrfトークンを作成するには?
ユーザーがフォームを操作してテキストをデータベースに投稿できるように、リーフレット ポップアップで csrf トークンを作成するにはどうすればよいですか? タグを単純な html フォームに追加しましたが{% csrf_token %}
、これは正常に機能しますが、ポップアップのコンテンツ セクションに配置すると機能しませんが、他の html 要素は正常に機能します。
});
基本的に、トークンをそのままにしておくと、Leaflet マップがまったく読み込まれませんが、省略すると、CSRF トークンが見つからないか、正しくないエラーが発生します。
私はこれらすべて(javascript/leaflet/web dev/django)に少し慣れていないので、問題がどこから来ているのか、どこから始めればよいのかわかりません。leaflet.js コードをいじる必要があると思いますが、それを理解できるとは確信していません。どこに行くべきか、挿入できるコード、または(素人の言葉で)コードが機能しない理由を教えてください。
maps - Leaflet を使って Google マップのように、住所を検索して場所にピンを付けられるようにすることはできますか? どうすればいいですか?
一部のサイトが道路データを使用し、マップ タイルにオーバーレイする方法について読んだことがあります。これはリーフレットで必要ですか?マーカーの添付については、リーフレットのドキュメントでかなり詳しく説明されていると思いますが、Google マップで住所の完全な検索機能を提供する (理想的にはかなり簡単な) 方法があるかどうかはわかりません。
events - Leafletマップポリゴンでイベントをトリガーする方法は?
Leafletポリゴン(GeoJSON経由でロード)のイベントを手動でトリガーする方法を理解しようとしています。
一言で言えば、私は多数のポリゴンを含むリーフレットマップを持っています。また、マップの外側に通常のハイパーリンクがあり、クリックすると、特定のポリゴンでマウスオーバーイベント(または実際には任意のイベント)がトリガーされます。
ハイパーリンクを特定のポリゴンのイベントにバインドできるように、すべてのポリゴンにIDを割り当てるにはどうすればよいですか?それとも、これを行う最も論理的な方法ですか?
最終的には、各ポリゴンに関連付けられたテキストラベルのHTMLテーブルとともに、多数のポリゴンを含むマップを作成しようとしています。HTMLテーブルのテキストをクリックするときに、マップポリゴンでイベントをトリガーしたい(またはその逆)。各ポリゴンを参照する方法がわかりません。
これが私の非常に単純化されたHTMLです:
これが私の非常に単純化されたJSです:
javascript - リーフレットで使用されるタイル形式は何ですか?
巨大な回路図、つまり写真ではないラスター画像を使用する Web サイトを計画しています。それらが写真であり、そのように表示することに興味がある場合は、zoomify、IIPImageまたはPanoJSのいずれかを使用します。これらのソリューションはすべて HTML5 をサポートしていますが、JPEG 用に最適化されているか、難解な JavaScript を使用しているか、遷移がスムーズでないため、私の目的には完全に満足できるものではありません。
そこで、リーフレットをカスタムタイルで使用できないかと考えていました。つまり、javascript をマップ サーバーに接続する代わりに、回路図を使用して独自のタイル プロバイダーに接続することができます。私の理論的根拠は、リーフレットがスムーズなレンダリングを提供し、使用されているタイル片が png のように見え、マーカーとベクター レイヤーを使用することさえできるということです。しかし、私はつまずきに来ました:
リーフレットはどのような種類のタイルを期待していますか? それについての情報はどこにありますか?地図の投影、または私が認識していないその他の地理固有の側面は問題になりますか?
助けてくれてありがとう。
javascript - リーフレットエラー:LayerGroupでカスタムアイコンマーカーを作成するときに、オブジェクト関数にメソッド'createIcon'がありません
XMLストリームからマーカーを作成し、それらにカスタムアイコンを設定しています。特定のタイプのすべてのマーカーをオフにすることをサポートできるように、マーカーをグループレイヤーに配置したいと思います。カスタムアイコンを使用して(GroupLayerを使用して)マップにマーカーを追加すると、次のエラーが発生します。
Uncaught TypeError:Object function(){this.initialize && this.initialize.apply(this、arguments)}にはメソッド'createIcon'がありません
アイコンの例
レイヤーの例
マップまたはLayerGroupにマーカーを追加する
最初にマップにグループレイヤーを追加し、次にグループレイヤーにマーカーを追加してみました。
- アイコン変数がインスタンス化されます
- GroupLayer変数がインスタンス化されます
- GroupLayersがマップに追加されます
- マーカーはアイコンオプションで作成されます
- マーカーがGroupLayerに追加されます
そして、最初にグループレイヤーにマーカーを追加してから、マップにグループレイヤーを追加してみました。
- アイコン変数がインスタンス化されます
- GroupLayer変数がインスタンス化されます
- マーカーはアイコンオプションで作成されます
- マーカーがGroupLayerに追加されます
- GroupLayersがマップに追加されます
jquery - リーフレット マップの URL は禁止されています
jquery mobile phonegap アプリを作成しようとしていますが、そこに埋め込まれたリーフレット マップを使用したいと考えています。現在、かなり基本的な概念実証を行っていますが、あまり運がありません。マップを読み込もうとするたびに、マップの .png が読み込まれず、コンソールに Forbidden と表示されます。おそらくマップの URL を間違って設定していると思いますが、CloudMade の Web サイトのドキュメントは少しあいまいです。あなたが提供できるどんな助けも大歓迎です。
コード:
画像を読み込もうとすると、次のエラーが表示されます: GET http://a.tile.cloudmade.com/MY_APP_KEY/997/256/0/0/0.png 403 (禁止)。明らかに、MY_APP_KEY を CloudMade から取得したキーに置き換えていますが、それ以外にどこを参照すればよいかわかりません。
助けてくれてありがとう。
leaflet - リーフレット ポリゴンでネイティブ ポップアップをトリガーする方法
リーフレット ポリゴンでネイティブ ポップアップを手動でトリガーするにはどうすればよいですか?
次のように、ネイティブ ポップアップを各レイヤーにバインドできます。
そして、後で次のように参照できるように、各ポリゴンに手動で ID を割り当てました。
次のようにポップアップをトリガーしようとしました:
しかし、それは私に次のようなエラーを与えます:
どこが間違っているのか分かりますか?