0

中古品の出品者を紹介するページを書いています。マップ上には、価格、商品の状態、販売者の在庫がある期間などの短い情報要素が多数あります。情報ウィンドウの空き領域を減らして、より多くの情報ウィンドウを画面に収めたいと考えています。wicket-stuff gmap3 の 6.5.0 で新しい機能を試してみました - 「情報ウィンドウ内のパネル」ですが、うまくいきません - 画像は css の結果を示しています:

border : 1px solid black ;
margin : 0;
padding : 0;

情報 winfo ウィンドウの空き領域を最小限に抑えてコンテンツに合わせるにはどうすればよいですか?

PSポインターでクリック可能な数字のグループを作成できれば最高です。ただし、情報ウィンドウはクリックできないため、マーカーがあります。アイデア - ユーザーはまず、情報ウィンドウに表示される主要なプロパティに基づいて選択を行い、次にその選択をクリックして、ページの別の場所に表示される情報を完成させます。

PPSうーん、もう1つアイデアがあります-州の数字は必要ありません。情報をさまざまな色でペイントできます（緑=「新品のように」、青=「ハードに使用されていますが、機能します」、赤=「ゴミ」）:)。

ここに画像の説明を入力

4

1 に答える 1

1

速くて汚い

var infowindow = new google.maps.InfoWindow({
  content: '<div id="iw_content"><a href="/" style="color:#f00">3434</a> <a href="/" style="color:#00f">4</a> <a href="/" style="color:#0f0">18-9</a></div>'
});

google.maps.event.addListener(infowindow,'domready',function(){
  var el = document.getElementById('iw_content');
  //* Get and set a class for the main content containers container
  el = el.parentNode.parentNode;
  el.setAttribute('class','iw_content_container_container');
  //* Get and set a class for the div containing the close window image
  closeEl = (el.previousElementSibling)?el.previousElementSibling:el.previousSibling;
  closeEl.setAttribute('class','closeInfoWindow');
  //* Get and set a class for the div containing the close and main content
  el = el.parentNode;
  el.setAttribute('class','closeInfoWindowContainer');
  //* Get and hide the troublesome background
  el = (el.previousElementSibling)?el.previousElementSibling:el.previousSibling;
  el.style.display = "none";
  //* Get and hide the top image of the arrow
  el = (el.previousElementSibling)?el.previousElementSibling:el.previousSibling;
  el.style.display = 'none';
  //* Get and hide the shadow (hiding commented out for now as not strictly requested)
  el = el.parentNode.parentNode;
  el = (el.previousElementSibling)?el.previousElementSibling.previousElementSibling:el.previousSibling.previousSibling;
  //el.style.display = 'none';
});

それはあなたがcssで対処できるコードにいくつかのフックを入れるのに役立つかもしれません

#iw_content{background:#fff}
.iw_content_container_container{height:auto!important;text-align:center}
.closeInfoWindow {top:22px!important;right:22px!important}
.closeInfoWindowContainer{position:absolute;top:52px;height:auto!important}

.closeInfoWindowContainerのトップ値はテキストの量に依存するため、これをいじりたい場合があります。基本的にあなたのその1行だけでテストされています。

コード自体の幅と高さを実際に削除してみましたが（JavaScript内で追加/変更）、ロード時のカーソルの状態と位置によっては、マップを元に戻すという厄介な習慣があります。

..。

情報ウィンドウはクリック可能です。これらはページ内の通常のdiv要素であり、そのように扱うことができます。これを示すために、例のハイパーリンクにさまざまな値を作成しました。

申し訳ありませんが、それはウィケットではありませんが、それでも解決策を投稿する必要があると思いました。

于 2013-02-26T23:50:50.320 に答える