【问题标题】:Nokia here maps api诺基亚这里地图api
【发布时间】:2014-01-14 19:40:35
【问题描述】:

我在这里使用诺基亚地图。 我已经看到,如果地图在一个小的 div 容器内,地图上的控制按钮(切换按钮显示/隐藏交通,切换按钮显示/隐藏公共交通)消失。 有没有办法避免这种行为(例如通过移动/调整控件大小)?

我使用了标准示例代码来制作带有组件的基本地图: https://developer.here.com/javascript-apis/enterprise-api-explorer

并将地图放在一个 div 中,根据屏幕宽度调整自身大小(这是我的 javascript)

<script>
    window.onload=window.onresize=function(){
    $("#bigMapContainerTraff").width($(window).width()-50);
    $("#bigMapContainerTraff").height($(window).height()-50);};
</script>

【问题讨论】:

    标签: here-api


    【解决方案1】:

    标准控件就是这样 - 标准控件在灵活性方面提供的不多,但提供了跨应用程序的一致性。如果您想做其他事情,最好从头开始编写自定义组件:

    function extend(B, A) {
        function I() {}
        I.prototype = A.prototype;
        B.prototype = new I();
        B.prototype.constructor = B;
    }
    
    var myCustomComponentSimple = function (callback) {
        var myNode = document.createElement("div"); 
        this.callback = callback;   
        this.getId = function() { return "MySimpleCustomComponent"; };  
        this.attach = function(display) {
    
    var myHTML = '<div  id="myCustomComponentButton" style="position: absolute; left: 5px; top: 5px;' +
              'background: #ccc; border: 1px solid #000; padding: 10px;" />';
    
            myNode.innerHTML = myHTML;
    
            display.getUIContainer().appendChild(myNode);
            if(!this.button) {
                this.button =  nokia.maps.dom.EventTarget(
                                 document.getElementById(
                                         "myCustomComponentButton"));
            }
    
            this.button.addListener("click", this.callback);
        };
        this.detach = function(display) {
            display.getUIContainer().removeChild(myNode);
            this.button.removeListener("click", this.callback);
        };
    
        // Call the "super" constructor to initialize properties
        nokia.maps.map.component.Component.call(this);
    
    };
    extend(myCustomComponentSimple, 
                nokia.maps.map.component.Component);
    
    
    var customControl = new myCustomComponentSimple(function(){ 
      alert("doSomething");
    
        });
        map.components.add(customControl);
    

    简单的控件将单个&lt;DIV&gt; 注入到DOM 中,并为click 事件提供回调函数——因为您可以控制此元素的样式,您可以根据需要放置或设置样式。您可以通过添加地图状态的切换来轻松复制按钮的行为,如here 所述

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多