0

ページはGoogleマップで読み込まれ、最初はその周囲のコンテナを埋めません。0.5秒後、Googleマップがコンテナをいっぱいにします。

問題は、容器が適切に充填された後に歪むことです。シフトによる経度線は、2本が隣り合って表示されます。また、マップコントロールも歪んでいます。ズームバーがそこにあることすらわかりません。

どんな助けでも大歓迎です！

これは私が作り始めたばかりのWordpressプラグインの一部です。

まだ写真を投稿できないか、投稿します！

4

3 に答える 3

2

問題は、ワードプレスが使用するデフォルトのテーマにありました。以下のコード行は、Google マップを台無しにするために必要な幅の 97.5% までしか移動できないことを示しています。

.entry-content img, .comment-content img, .widget img { max-width: 97.5%; }

正しいコード（または私のために働いたもの）：

.entry-content img, .comment-content img, .widget img { max-width: none; }

于 2012-06-08T20:16:42.717 に答える
0

私はこの問題を数回前に経験しましたが、そのパッケージから明確に舵を切るため、ワードプレスではありませんでした。しかし、2つの原因がありました...

1つは、マップが表示/ロードされた後に毎回発生します。これは、gmaps外部スクリプト呼び出しが複数回ロードされたことが原因でした。

2つ目は、マップブロック要素に影響を与えていた相対/絶対位置要素によるものでした...それから数週間経った100％を思い出せません。

onloadイベントなどをどのように処理していますか...

于 2012-06-05T20:49:18.847 に答える
0

同じ問題を抱えている他の誰かを助けることができる回答を書くことにしました。

私は最近この問題に遭遇し、同じ問題に加えて何か他の問題がありました。Google マップのズーム バーが表示されず、すべての画像にグレーの境界線が表示されていました :) すべての問題は、23 テーマのデフォルト スタイルが原因です。

/* Responsive images */
.entry-content img,
.comment-content img,
.widget img {
    max-width: 100%; /* Fluid images for posts, comments, and widgets */
}

そして下

.entry-content img,
.comment-content img,
.widget img,
img.header-image,
.author-avatar img,
img.wp-post-image {
    /* Add fancy borders to all WordPress-added images but not things like badges and icons and the like */
    border-radius: 3px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
}

id = map_canvas の div に Google マップ オブジェクトがありました。解決策は、上記のスタイルの上書きを私のスタイルに追加することでした:

 #map-canvas img {
     max-width: none!important;
    border-radius: none!important;
    box-shadow: none!important;
 }

出来上がり！マップはきれいです:)

于 2013-12-20T15:42:36.713 に答える