Как разместить карту и таблицу в одном окне pyqt5

Question

Не могу разобраться как разместить в виджет карту, которую поднимаю на flask локально.

Моя цель разместить в общем окне таблицу ответа по поиску из базы и нанести на карту маркеры по спискам полученных координат с возможностью очистки карты от маркеров с запросом.

Код:

import io
import folium
import os
import sys
import time
from PyQt5 import QtCore, QtGui, QtWidgets, QtWebEngineWidgets
from des import *
import sqlite3
from sqlite3 import Error
from PyQt5.QtWidgets import QTableWidget, QTableWidgetItem


def sql_connection():
    try:
        con = sqlite3.connect('number.db')
        return con

    except Error:
        print(Error)


class proba(QtWidgets.QMainWindow):
    def __init__(self, parent=None):
        QtWidgets.QWidget.__init__(self, parent)
        self.ui = Ui_proba()
        self.ui.setupUi(self)
        self.setWindowIcon(QtGui.QIcon("let.png"))
        self.ui.tableWidget.setColumnCount(6)
        self.column_label = ['data', 'geo', 'model', 'gorod', 'marka', 'klient']  # рисуем столбцы
        self.ui.tableWidget.setHorizontalHeaderLabels(self.column_label)
        # self.ui.tableWidget.setRowCount(1000)
        self.ui.lineEdit.setMaxLength(11)  # ограничиваем ввод данных
        self.ui.lineEdit.setStyleSheet("color: rgb(28, 43, 255);")
        self.ui.lineEdit_2.setMaxLength(15)  # ограничиваем ввод символов
        self.ui.lineEdit_3.setMaxLength(15)
        # self.ui.lineEdit.clicked.connect(self.offliner)
        self.ui.pushButton.clicked.connect(self.handler)
        self.ui.pushButton_2.clicked.connect(self.clears)
        # self.ui.QtWebEngineWidgets = QtWebEngineWidgets.QWebEngineView(proba)
        self.ui.QtWebEngineWidgets.setGeometry(QtCore.QRect(790, 150, 581, 521))

    def handler(self):
        h = self.ui.lineEdit.text()
        self.ui.tableWidget.setRowCount(0)  # убираем записи таблицы
        try:
            if len(h) == 11:
                k = "off"
                m = "off"
                self.ui.lineEdit.setToolTip('Вы ввели номер ')
                vs = h + "';"
                con = sql_connection()
                cursorObj = con.cursor()
                cursorObj.execute("SELECT * FROM geos WHERE klient LIKE '%" + vs)
                rows = cursorObj.fetchall()
                # one_result = cursorObj.fetchmany(100)
                print(rows)
                # i = 0
                latitudes = []
                longitudes = []
                for row in rows:
                    inx = rows.index(row)
                    # print(inx)
                    mark = row[3].split(" ")
                    # print(mark[0], mark[1])
                    latitudes.append(mark[0])
                    longitudes.append((mark[1]))
                    self.ui.tableWidget.insertRow(inx)
                    self.ui.tableWidget.setItem(inx, 0, QTableWidgetItem(str(row[1])))
                    self.ui.tableWidget.setItem(inx, 1, QTableWidgetItem(str(row[3])))
                    self.ui.tableWidget.setItem(inx, 2, QTableWidgetItem(str(row[4])))
                    self.ui.tableWidget.setItem(inx, 3, QTableWidgetItem(str(row[5])))
                    self.ui.tableWidget.setItem(inx, 4, QTableWidgetItem(str(row[6])))
                    self.ui.tableWidget.setItem(inx, 5, QTableWidgetItem(str(row[7])))
                self.view = QtWebEngineWidgets.QWebEngineView()
                print(latitudes, longitudes)
                # ответ примерно такой latitudes = ['51.662010', '51.730686', '51.730602', '51.734493']
                #                      longitudes = ['39.172375', '39.203022', '39.201488', '39.196053']

                m = folium.Map(location=[51.67204, 39.1843],
                               zoom_start=13,
                               tiles='http://127.0.0.1:4567/image?z={z}&x={x}&y={y}',  #  локальный tiel сервер с картой
                               attr='My map')

                feature_group = folium.FeatureGroup("Locations")
                for lat, lon in zip(latitudes, longitudes):
                    feature_group.add_child(folium.Marker(location=[lat, lon]))
                m.add_child(feature_group)
                data = io.BytesIO()
                m.save(data, close_file=False)
                self.view.setHtml(data.getvalue().decode())


                # не подгружается карта в виджет, отдельно код работает и подгружает маркеры


            else:
                self.ui.lineEdit.setToolTip('неправильно, попробуйте ещё!')

        except Error:
            print(Error)
        k = self.ui.lineEdit_2.text()

        try:
            if len(k) == 15:
                self.ui.tableWidget.setRowCount(0)
                print("Вы ввели model")
                vmsi = k + "';"
                con = sql_connection()
                cursorObj = con.cursor()
                cursorObj.execute("SELECT * FROM geosm WHERE model LIKE '%" + vmsi)
                rows = cursorObj.fetchall()
                # one_result = cursorObj.fetchmany(100)
                print(rows)
                # i = 0
                for row in rows:
                    inx = rows.index(row)
                    # print(inx)
                    self.ui.tableWidget.insertRow(inx)
                    self.ui.tableWidget.setItem(inx, 0, QTableWidgetItem(str(row[1])))
                    self.ui.tableWidget.setItem(inx, 1, QTableWidgetItem(str(row[3])))
                    self.ui.tableWidget.setItem(inx, 2, QTableWidgetItem(str(row[4])))
                    self.ui.tableWidget.setItem(inx, 3, QTableWidgetItem(str(row[5])))
                    self.ui.tableWidget.setItem(inx, 4, QTableWidgetItem(str(row[6])))
                    # self.ui.tableWidget.setItem(inx, 5, QTableWidgetItem(str(row[7])))

            else:
                self.ui.lineEdit_2.setToolTip('неправильно, попробуйте ещё!')
        except Error:
            print(Error)
        m = self.ui.lineEdit_3.text()
        try:
            if len(m) == 15:
                self.ui.tableWidget.setRowCount(0)
                vimei = m + "';"
                con = sql_connection()
                cursorObj = con.cursor()
                cursorObj.execute("SELECT * FROM geosm WHERE marka LIKE '%" + vimei)
                rows = cursorObj.fetchall()
                # one_result = cursorObj.fetchmany(100)
                print(rows)
                # i = 0
                for row in rows:
                    inx = rows.index(row)
                    # print(inx)
                    # print(str(row[1]),str(row[3]),str(row[4]),str(row[5]),str(row[6]))
                    self.ui.tableWidget.insertRow(inx)
                    self.ui.tableWidget.setItem(inx, 0, QTableWidgetItem(str(row[1])))
                    self.ui.tableWidget.setItem(inx, 1, QTableWidgetItem(str(row[3])))
                    self.ui.tableWidget.setItem(inx, 2, QTableWidgetItem(str(row[4])))
                    self.ui.tableWidget.setItem(inx, 3, QTableWidgetItem(str(row[5])))
                    self.ui.tableWidget.setItem(inx, 4, QTableWidgetItem(str(row[6])))
                    # self.ui.tableWidget.setItem(inx, 5, QTableWidgetItem(str(row[7])))


            else:
                self.ui.lineEdit_2.setToolTip('неправильно, попробуйте ещё!')

        except Error:
            print(Error)

    def clears(self):
        self.ui.lineEdit.clear()
        # self.ui.tableWidget.clear()
        self.ui.tableWidget.setRowCount(0)
        self.ui.lineEdit_2.clear()
        self.ui.lineEdit_3.clear()


if __name__ == '__main__':
    app = QtWidgets.QApplication(sys.argv)
    myapp = proba()
    myapp.show()
    sys.exit(app.exec_())

Сервер:

import os
from flask import Flask
from flask import send_file
from flask import request
from js.leaflet import leaflet


app = Flask(__name__)


@app.route("/")
def index():
    return "Local Map Server"


@app.route('/image', methods=['GET'])
def query_strings():
    args1 = request.args['z']
    args2 = request.args['x']
    args3 = request.args['y']
    file = ("Tiles/" + "{}/"+"{}/").format(args1, args2)  #"Tiles/
    return send_file(file + args3 + ".png")


if __name__ == "__main__":
    app.run(host='127.0.0.1', port=4567)

Answer 1

Разобрался, у вас есть два момента опечаток:

В UI у вас вместо view объект называется QtWebEngineWidgets (в ui файле у того виджета поменяйте object name на view)
В handler вместо использования виджета-браузера на форме, вы создаете новый и в него подгружаете кусок html с картой

Добавил # <<< там, где были опечатки.

des.py:

from PyQt5 import QtCore, QtGui, QtWidgets
from PyQt5 import QtWebEngineWidgets


class Ui_proba(object):
    def setupUi(self, proba):
        proba.setObjectName("proba")
        proba.setWindowModality(QtCore.Qt.WindowModal)
        proba.setEnabled(True)
        proba.resize(1380, 655)
        sizePolicy = QtWidgets.QSizePolicy(QtWidgets.QSizePolicy.Preferred, QtWidgets.QSizePolicy.Preferred)
        sizePolicy.setHorizontalStretch(0)
        sizePolicy.setVerticalStretch(0)
        sizePolicy.setHeightForWidth(proba.sizePolicy().hasHeightForWidth())
        proba.setSizePolicy(sizePolicy)
        proba.setContextMenuPolicy(QtCore.Qt.NoContextMenu)
        icon = QtGui.QIcon()
        icon.addPixmap(QtGui.QPixmap("k.png"), QtGui.QIcon.Normal, QtGui.QIcon.Off)
        proba.setWindowIcon(icon)
        proba.setAutoFillBackground(False)
        proba.setStyleSheet("background-image: url(93.jpg)")
        self.pushButton = QtWidgets.QPushButton(proba)
        self.pushButton.setGeometry(QtCore.QRect(10, 40, 89, 25))
        self.pushButton.setObjectName("pushButton")
        self.pushButton_2 = QtWidgets.QPushButton(proba)
        self.pushButton_2.setGeometry(QtCore.QRect(10, 80, 89, 25))
        self.pushButton_2.setObjectName("pushButton_2")
        self.lineEdit = QtWidgets.QLineEdit(proba)
        self.lineEdit.setGeometry(QtCore.QRect(120, 34, 221, 31))
        self.lineEdit.setObjectName("lineEdit")
        self.tableWidget = QtWidgets.QTableWidget(proba)
        self.tableWidget.setGeometry(QtCore.QRect(30, 160, 751, 481))
        self.tableWidget.setObjectName("tableWidget")
        self.lineEdit_2 = QtWidgets.QLineEdit(proba)
        self.lineEdit_2.setGeometry(QtCore.QRect(120, 70, 221, 31))
        self.lineEdit_2.setObjectName("lineEdit_2")
        self.lineEdit_3 = QtWidgets.QLineEdit(proba)
        self.lineEdit_3.setGeometry(QtCore.QRect(120, 110, 221, 31))
        self.lineEdit_3.setObjectName("lineEdit_3")
        self.label = QtWidgets.QLabel(proba)
        self.label.setGeometry(QtCore.QRect(360, 40, 111, 17))
        self.label.setObjectName("label")
        self.label_2 = QtWidgets.QLabel(proba)
        self.label_2.setGeometry(QtCore.QRect(360, 80, 67, 17))
        self.label_2.setObjectName("label_2")
        self.label_3 = QtWidgets.QLabel(proba)
        self.label_3.setGeometry(QtCore.QRect(360, 120, 67, 17))
        self.label_3.setObjectName("label_3")
        self.retranslateUi(proba)
        self.view = QtWebEngineWidgets.QWebEngineView(proba)      # <<<
        self.view.setGeometry(QtCore.QRect(790, 150, 581, 521))   # <<<
        self.view.setObjectName("view")                           # <<<

        QtCore.QMetaObject.connectSlotsByName(proba)

    def retranslateUi(self, proba):
        _translate = QtCore.QCoreApplication.translate
        proba.setWindowTitle(_translate("proba", "Пример"))
        self.pushButton.setText(_translate("proba", "Поиск"))
        self.pushButton_2.setText(_translate("proba", "Очистить"))
        self.label.setText(_translate("proba", "Абонентский"))
        self.label_2.setText(_translate("proba", "модель"))
        self.label_3.setText(_translate("proba", "ип"))

okno.py:

# -*- coding: utf-8 -*-

import io
import folium
import os
import sys
import time
import karte
from PyQt5 import QtCore, QtGui, QtWidgets, QtWebEngineWidgets
from des import *
import sqlite3
from sqlite3 import Error
from PyQt5.QtWidgets import QTableWidget, QTableWidgetItem


def sql_connection():
    try:
        con = sqlite3.connect('number1.db')
        return con

    except Error:
        print(Error)


class proba(QtWidgets.QMainWindow):

    def __init__(self, parent=None):
        QtWidgets.QWidget.__init__(self, parent)
        self.ui = Ui_proba()
        self.ui.setupUi(self)
        self.setWindowIcon(QtGui.QIcon("let.png"))
        self.ui.tableWidget.setColumnCount(6)
        self.column_label = ['data', 'geo', 'model', 'gorod', 'telname', 'klient']  # рисуем столбцы data, standart, geo, model, gorod, , klient
        self.ui.tableWidget.setHorizontalHeaderLabels(self.column_label)
        # self.ui.tableWidget.setRowCount(1000)
        self.ui.lineEdit.setMaxLength(11)  # ограничиваем ввод данных
        self.ui.lineEdit.setStyleSheet("color: rgb(28, 43, 255);")
        self.ui.lineEdit_2.setMaxLength(15)  # ограничиваем ввод символов
        self.ui.lineEdit_3.setMaxLength(15)

        # self.ui.lineEdit.clicked.connect(self.offliner)
        self.ui.pushButton.clicked.connect(self.handler)
        self.ui.pushButton_2.clicked.connect(self.clears)
        # self.ui.QtWebEngineWidgets = QtWebEngineWidgets.QWebEngineView(proba)
        self.ui.view.setGeometry(QtCore.QRect(790, 150, 581, 521))

    def handler(self):
        h = self.ui.lineEdit.text()
        self.ui.tableWidget.setRowCount(0)  # убираем записи таблицы

        try:
            if len(h) == 11:
                k = "off"
                m = "off"
                self.ui.lineEdit.setToolTip('Вы ввели номер ')

                con = sql_connection()
                cursorObj = con.cursor()
                cursorObj.execute("SELECT * FROM geos1 WHERE telname LIKE '%' || ? || '%'", [h])
                rows = cursorObj.fetchall()
                # one_result = cursorObj.fetchmany(100)
                print(rows)
                # i = 0
                latitudes = []
                longitudes = []
                for row in rows:
                    inx = rows.index(row)
                    # print(inx)
                    mark = row[3].split(" ")
                    # print(mark[0], mark[1])
                    latitudes.append(mark[0])
                    longitudes.append((mark[1]))
                    self.ui.tableWidget.insertRow(inx)
                    self.ui.tableWidget.setItem(inx, 0, QTableWidgetItem(str(row[1])))
                    self.ui.tableWidget.setItem(inx, 1, QTableWidgetItem(str(row[3])))
                    self.ui.tableWidget.setItem(inx, 2, QTableWidgetItem(str(row[4])))
                    self.ui.tableWidget.setItem(inx, 3, QTableWidgetItem(str(row[5])))
                    self.ui.tableWidget.setItem(inx, 4, QTableWidgetItem(str(row[6])))
                    self.ui.tableWidget.setItem(inx, 5, QTableWidgetItem(str(row[7])))

                print(latitudes, longitudes)

                m = folium.Map(
                    location=[51.67204, 39.1843],
                    zoom_start=13,
                    tiles='http://127.0.0.1:4567/image?z={z}&x={x}&y={y}',  #  локальный teil сервер с картой
                    attr='My map'
                )

                feature_group = folium.FeatureGroup("Locations")
                for lat, lon in zip(latitudes, longitudes):
                    feature_group.add_child(folium.Marker(location=[lat, lon]))
                m.add_child(feature_group)

                data = io.BytesIO()
                m.save(data, close_file=False)
                self.ui.view.setHtml(data.getvalue().decode())  # <<<

            else:
                self.ui.lineEdit.setToolTip('неправильно, попробуйте ещё!')

        except Error:
            print(Error)
        k = self.ui.lineEdit_2.text()

        try:
            if len(k) == 14:
                self.ui.tableWidget.setRowCount(0)
                print("Вы ввели model")
                vmsi = k + "';"
                con = sql_connection()
                cursorObj = con.cursor()
                cursorObj.execute("SELECT * FROM geos1 WHERE model LIKE '%" + vmsi)
                rows = cursorObj.fetchall()
                # one_result = cursorObj.fetchmany(100)
                print(rows)
                # i = 0
                for row in rows:
                    inx = rows.index(row)
                    # print(inx)
                    self.ui.tableWidget.insertRow(inx)
                    self.ui.tableWidget.setItem(inx, 0, QTableWidgetItem(str(row[1])))
                    self.ui.tableWidget.setItem(inx, 1, QTableWidgetItem(str(row[3])))
                    self.ui.tableWidget.setItem(inx, 2, QTableWidgetItem(str(row[4])))
                    self.ui.tableWidget.setItem(inx, 3, QTableWidgetItem(str(row[5])))
                    self.ui.tableWidget.setItem(inx, 4, QTableWidgetItem(str(row[6])))
                    self.ui.tableWidget.setItem(inx, 5, QTableWidgetItem(str(row[7])))

            else:
                self.ui.lineEdit_2.setToolTip('неправильно, попробуйте ещё!')
        except Error:
            print(Error)
        m = self.ui.lineEdit_3.text()
        try:
            if len(m) == 11:
                self.ui.tableWidget.setRowCount(0)
                ip = m + "';"
                con = sql_connection()
                cursorObj = con.cursor()
                cursorObj.execute("SELECT * FROM geos1 WHERE klient LIKE '%" + ip)
                rows = cursorObj.fetchall()
                # one_result = cursorObj.fetchmany(100)
                print(rows)
                # i = 0
                for row in rows:
                    inx = rows.index(row)
                    # print(inx)
                    # print(str(row[1]),str(row[3]),str(row[4]),str(row[5]),str(row[6]))

                    self.ui.tableWidget.insertRow(inx)
                    self.ui.tableWidget.setItem(inx, 0, QTableWidgetItem(str(row[1])))
                    self.ui.tableWidget.setItem(inx, 1, QTableWidgetItem(str(row[3])))
                    self.ui.tableWidget.setItem(inx, 2, QTableWidgetItem(str(row[4])))
                    self.ui.tableWidget.setItem(inx, 3, QTableWidgetItem(str(row[5])))
                    self.ui.tableWidget.setItem(inx, 4, QTableWidgetItem(str(row[6])))
                    self.ui.tableWidget.setItem(inx, 5, QTableWidgetItem(str(row[7])))


            else:
                self.ui.lineEdit_2.setToolTip('неправильно, попробуйте ещё!')

        except Error:
            print(Error)

    def clears(self):
        self.ui.lineEdit.clear()
        # self.ui.tableWidget.clear()
        self.ui.tableWidget.setRowCount(0)
        self.ui.lineEdit_2.clear()
        self.ui.lineEdit_3.clear()


if __name__ == '__main__':
    app = QtWidgets.QApplication(sys.argv)
    myapp = proba()
    myapp.show()

    myapp.ui.lineEdit.setText('74732555555')

    sys.exit(app.exec_())

PS.

По моему мнению, код сильно нуждается в рефакторинге, но идея и то, что уже может программа выглядит очень интересно, хорошая работа ?

PPS.

Поменял запрос в базу, чтобы не было sql-инъекции. Это может быть неважно в вашем проекте

БЛОГ НА HUSL

Как разместить карту и таблицу в одном окне pyqt5

Ответы (1 шт):