Nokia здесь карты api

Я использую здесь карты Nokia. Я видел, что кнопка управления на карте (кнопка переключения для отображения / скрытия трафика, кнопка переключения для отображения / скрытия общественного транспорта) исчезает, если карта находится внутри небольшого контейнера 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>

person user3098549    schedule 14.01.2014    source источник


Ответы (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);

Простой элемент управления вводит один <DIV> в DOM и предоставляет функцию обратного вызова для события click - поскольку вы можете управлять стилем этого элемента, вы можете разместить его или стилизовать по своему усмотрению. Вы можете легко воспроизвести поведение кнопок, добавив переключатель для состояния карты, как описано в здесь

person Jason Fox    schedule 16.01.2014