GetProjection не является функцией - google-maps-react

Я пытаюсь рисовать изогнутые линии с помощью google-maps-react. Для этого я поискал и нашел этот вопрос "Как изогнуть ломаную линию в react-google-maps?". В этом вопросе ответ относится к проекту песочницы, в котором такое внедрение выполняется.

Я попытался адаптировать этот код, чтобы он работал у меня, но у меня возникли проблемы с получением «проекции» карты, которая необходима для вычисления «точки», используя

const p1 = mapProjection.fromLatLngToPoint(pos1),

После поиска свойств и состояния компонента карты я обнаружил, что внутри находится метод "getProjection": props -> google -> maps -> Map -> prototype -> getProjection.

Я попытался получить к нему доступ, используя:

mapProjection = {this.props.google.maps.Map.getProjection()}

и это приводит к ошибке «TypeError: this.props.google.maps.Map.getProjection не является функцией».

С использованием

mapProjection = {this.props.google.maps.Map.prototype.getProjection()}

приводит к неопределенному

Я действительно застрял и понятия не имею, как это обойти. Может ли кто-нибудь из вас указать мне правильное направление? Большое спасибо.

Как вы думаете, можно ли поместить свой код в CodeSandbox, чтобы мы могли его увидеть? Может облегчить понимание чего-то.

Iavor 02.04.2018 20:57

Трудно судить без остальной части кода, но мое первое предположение: getProjection () вызывается слишком рано. Этот пост показывает, что вы можете сделать stackoverflow.com/questions/17191664/…

Emmanuel Delay 03.04.2018 15:06
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
1
2
861
1

Ответы 1

Строка this.props.google.maps.Map.getProjection() пытается получить доступ к методу экземпляра карты как к методу, который статически доступен в самом классе карты. Поскольку getProjection можно вызвать только для объекта класса Map, вы должны вызвать getProjection() на карте, экземпляр которой вы создаете с помощью new maps.Map(myDomNode, myMapConfig);.

Если вы посмотрите этот учебник Как написать компонент Google Maps React, вы заметите, что новый экземпляр карты создается в функции loadMap компонента Map и прикрепляется к компоненту с помощью this.map = new maps.Map(node, mapConfig);.

В этот момент this.map (экземпляр карты) становится доступным для любого метода компонента Map, и вы можете получить проекцию с помощью var projection = this.map.getProjection();.

Другие вопросы по теме