Question

所以我的infowindow和标记工作，但我不知道如何使它显示在标记上方，例如：https://developers.google.com/maps/documentation/javascript/examples/infowindow-simple

我的样子是这样的：

这是因为它使用的是位置，而不是SELECT Customers.CustomerName, group_concat(Orders.OrderID) as OrderID FROM Customers LEFT JOIN Orders ON Customers.CustomerID=Orders.CustomerID group by Customers.CustomerName;对象。我如何获得此对象并将其传递给InfoWindow？代码如下。

html文件

Marker

vue文件

<div>
    test
    <gmap-map
        :center="center"
        :zoom="7"
        style="width: 100%; height: 300px"
    >
        <gmap-marker
            :key="index"
            v-for="(m, index) in markers"
            :position="m.position"
            :clickable="true"
            :draggable="true"
            :label="m.label"
            @click="openWindow"

        />
        <gmap-info-window 
            @closeclick="window_open=false" 
            :opened="window_open" 
            :position="infowindow"
        >
            Hello world!
        </gmap-info-window>    
    </gmap-map> 

    <table>
        <thead>
            <tr></tr>
        </thead>
        <tbody>
            <tr></tr>
        </tbody>
    </table>
</div>

Answer 1

您可以将pixelOffset设置为信息窗口以解决此问题。

    <gmap-info-window 
        @closeclick="window_open=false" 
        :opened="window_open" 
        :position="infowindow"
        :options="{
          pixelOffset: {
            width: 0,
            height: -35
          }
        }"
    >

demo https://codesandbox.io/s/jj972nj273

vue-google-map将infowindow设置为高于标记

1 个答案: