Угловые значки Google Maps для увеличения

Question

Я использую AGM (Angular 6) и не могу найти способ изменить значки увеличения / уменьшения на пользовательские.Сам AGM не имеет такой опции, это должно быть сделано с чистым JS?Если да, то как это сделать лучше всего, поскольку элементы управления не имеют идентификатора или другого вида идентификации?

Answer 1

Не думайте о переопределении элементов управления Google Maps, подумайте о создании своих собственных и размещении их на карте в местах, упомянутых здесь:

https://developers.google.com/maps/documentation/javascript/controls#CustomControls

Документы довольно понятны,Получил пример оттуда и изменил дно, чтобы вы поняли

      function CenterControl(controlDiv, map) {

        // Set CSS for the control border.
        var controlUI = document.createElement('div');
        controlUI.style.backgroundColor = '#fff';
        controlUI.style.border = '2px solid #fff';
        controlUI.style.borderRadius = '3px';
        controlUI.style.boxShadow = '0 2px 6px rgba(0,0,0,.3)';
        controlUI.style.cursor = 'pointer';
        controlUI.style.marginBottom = '22px';
        controlUI.style.textAlign = 'center';
        controlUI.title = 'Click to recenter the map';
        controlDiv.appendChild(controlUI);

        // Set CSS for the control interior.
        var controlText = document.createElement('div');
        controlText.style.color = 'rgb(25,25,25)';
        controlText.style.fontFamily = 'Roboto,Arial,sans-serif';
        controlText.style.fontSize = '16px';
        controlText.style.lineHeight = '38px';
        controlText.style.paddingLeft = '5px';
        controlText.style.paddingRight = '5px';
        controlText.innerHTML = 'Center Map';
        controlUI.appendChild(controlText);

        // Setup the click event listeners: simply set the map to Chicago.
        controlUI.addEventListener('click', function() {

          map.setZoom(map.getZoom() + 1 )
          //you would create another div for zoom -1 and call the function from there
          }
      }