Ошибка Javascript в коде Python: «Uncaught ReferenceError: карта не определена» ⇐ Python

[Anonymous]

Я разрабатывал окно, показывающее интерактивную карту, используя QtWebEngineWidgets PyQt5. Вот предварительный просмотр того, над чем я работал:
Окно с интерактивной картой
Одна из вещей, которые я пытался интегрировать, — это когда пользователь выбирает любой из Переключатели PO sample, карта изменит местоположение в сторону того места, где находится образец. Однако всякий раз, когда я запускаю код, при появлении окна выдается следующая ошибка:
js: Uncaught ReferenceError: map is not defined
Кроме того, всякий раз, когда я нажимаю любой из переключателей, я также получаю следующее:
js: Map instance not initialized.
Я пытался использовать JavaScript для интеграции функций кнопок внутри карты, где при нажатии на эти кнопки будет отображаться сообщение с использованием как Javascript, так и Python. Код довольно длинный, поэтому вот фрагменты кода, в которых возникают проблемы, оба из которых происходят внутри класса UI_MainWindow():
def load_map(self):
import folium
import os

center_lat, center_lng = 18.45, -66.08

self.map_obj = folium.Map(
location=[center_lat, center_lng],
zoom_start=15, # Adjust zoom level
min_zoom=14,
max_zoom=17,
control_scale=True
)

html_button = """

PO1

"""
folium.Marker([18.45, -66.08], icon=folium.DivIcon(html=html_button)).add_to(self.map_obj)

html_button2 = """

PO2

"""
folium.Marker([18.46, -66.07], icon=folium.DivIcon(html=html_button2)).add_to(self.map_obj)

move_js = """

var map_instance;

function initializeMap() {
// Assign the Leaflet map instance created by Folium to the global variable
map_instance = map;
}

function moveToLocation(lat, lng) {
if (map_instance) {
map_instance.flyTo([lat, lng], 16);
} else {
console.error("Map instance not initialized.");
}
}

"""
self.map_obj.get_root().html.add_child(folium.Element(move_js))

# Ensure the map instance is assigned after the DOM is fully loaded
init_map_js = """

document.addEventListener("DOMContentLoaded", function(event) {
initializeMap(); // Initialize the map instance
});

"""
self.map_obj.get_root().html.add_child(folium.Element(init_map_js))
]
map_path = os.path.join(os.getcwd(), "map_buttons.html")
self.map_obj.save(map_path)

self.webView.setUrl(QtCore.QUrl.fromLocalFile(map_path))

def update_label(self, radio_button):
if radio_button.isChecked():
self.sample_selected = True
self.label_8.setText("MUESTRA SELECCIONADA: " + radio_button.text())

# Enable buttons
self.btn1.setEnabled(True)
self.btn2.setEnabled(True)
self.btn3.setEnabled(True)
self.btn4.setEnabled(True)

# Move the map based on the selected radio button
if radio_button == self.radio:
# PO1 selected, move to its location
self.webView.page().runJavaScript("moveToLocation(18.45, -66.08);")
elif radio_button == self.radio2:
# PO2 selected, move to its location
self.webView.page().runJavaScript("moveToLocation(18.46, -66.07);")
# same for other buttons



Подробнее здесь: https://stackoverflow.com/questions/790 ... ot-defined