Question

以http://ubilabs.github.io/geocomplete/examples/draggable.html为例。

HTML：

<div id="addresses">
        <label>Address 1</label>
        <input type="text" class="form-control geocomplete" id="addr_1" data-addrn="1" placeholder="Type your address here" value="" />
        <div class="map_canvas" id="addr_canvas_1"></div>
        <div id="addr_inf_1">
            <input type="hidden" data-geo-1="lat" placeholder="Latitude" value="" />
            <input type="hidden" data-geo-1="lng" placeholder="Longitude" value="" />
        </div>

<script src="https://maps.googleapis.com/maps/api/js?key=xxxxx&amp;libraries=places"></script>
<script src="jquery.geocomplete.min.js"></script>

JS：

$(function(){
$("#addresses").find(".geocomplete").each(function() {
    var $cElem = $(this);
    var $addrNum = $cElem.data("addrn");
    $cElem.geocomplete({
      map: "#addr_canvas_"+$addrNum,
      details: "#addr_inf_1"+$addrNum,
      detailsAttribute: "data-geo-"+$addrNum,
      markerOptions: {
        draggable: true
      }
    });
});});

问题在于它显示地图而不是标记。为什么呢？

Answer 1

这行css是阻止地图上标记的原因

div {max-height：999％;}

geocomplete - 标记未显示

1 个答案: