Question

我正在尝试使用bootstrap面板作为google maps自定义控件，我使用了这个html（从我的js中使用的把手模板中获取：

This is an image of the behaviour that I have,the glyphicon I used for the control icon is too small and is visible as a blue speck

I built a fiddle for this but it does not work

    <div>
      <a href="#sample-panel" data-toggle="collapse">
         <span class="glyphicon glyphicon-tower"> </span>
      </a>
      <div class="panel panel-default">
        <div class="collapse panel-collapse" id="sample-panel"> 
            <div class="panel-body">
                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas ornare dolor sit amet erat interdum porttitor. Aliquam eget quam enim. Morbi ut justo porttitor, pellentesque velit vitae, mattis erat. Phasellus molestie turpis ante, a luctus nibh porta quis. Nulla quis malesuada ex. Nam sapien neque, volutpat vel semper vitae, hendrerit ut elit. Cras efficitur orci non ultricies commodo. Integer dictum luctus diam, tempus mollis lectus tristique ac. Cras dapibus quam eros, sed viverra justo elementum a. Etiam enim est, consectetur ac ex ut, lobortis ultrices nisi. Donec viverra mauris nec tellus luctus, vitae finibus mauris tincidunt.

                Nunc laoreet enim sed sem luctus iaculis. Praesent sem arcu, condimentum fermentum facilisis non, egestas at dolor. Vivamus at augue nisl. Integer in volutpat augue. Quisque blandit ullamcorper arcu. Morbi vehicula lobortis velit, nec cursus sapien accumsan ac. Etiam a lorem ut felis sodales dapibus sed vel lacus. Sed lorem lectus, maximus id velit.
            </div>
        </div>
     </div>
  </div>

我将它添加到Google地图中作为customControl，如下所示：

function createControl(el, map) {
 map.controls[google.maps.ControlPosition.TOP_RIGHT].push(el.get(0));
}      

//initialize
var $testControl=$('<div>'+Handlebars.templates.gmaps_panel_partial({
    id:"sample-panel",
    isCollapsible:true
})+'</div>').css("width","25%");

我发现面板自然向下打开控制器的右侧并折叠回顶部左侧。我可以做任何事情让面板向下打开到控件的左侧并折叠回到顶部 - 正确（即与当前行为相反）？

地图上的自定义面板作为Google地图控件

0 个答案: