Python 如何使用QWebEngineView打开下载文件对话框?
我正在构建一个pyqt5桌面界面,在这里我使用QWebEngineView显示一个html文件,在这里我显示一个传单地图。这很好用。 下一步是导出用户添加到地图中的所有要素。当我点击地图上的“导出功能”时,什么也没发生,但当我在Chromium web浏览器上打开相同的html文件时,“导出功能”会打开下载对话框 PyQt5脚本:Python 如何使用QWebEngineView打开下载文件对话框?,python,pyqt,pyqt5,qwebengineview,Python,Pyqt,Pyqt5,Qwebengineview,我正在构建一个pyqt5桌面界面,在这里我使用QWebEngineView显示一个html文件,在这里我显示一个传单地图。这很好用。 下一步是导出用户添加到地图中的所有要素。当我点击地图上的“导出功能”时,什么也没发生,但当我在Chromium web浏览器上打开相同的html文件时,“导出功能”会打开下载对话框 PyQt5脚本: self.MainWindow.webMapViewer = QtWebEngineWidgets.QWebEngineView() self.MainWindow.
self.MainWindow.webMapViewer = QtWebEngineWidgets.QWebEngineView()
self.MainWindow.webPageLayout.addWidget(self.MainWindow.webMapViewer)
self.html_path = os.path.split(os.path.abspath(__file__))[0] + r'/html/test.html'
self.MainWindow.webMapViewer.load(QtCore.QUrl().fromLocalFile(self.html_path))
HTML:
FazMaraneyRGB_透明_马赛克_组1
正文{margin:0;padding:0;}
正文,表格,tr,td,th,div,h1,h2,输入{字体系列:“Calibri”,“投石机MS”,“Ubuntu”,衬线;字体大小:11pt;}
#映射{位置:绝对;顶部:0;底部:0;宽度:100%;}/*全尺寸*/
.ctl{
填充:2x10px 2x10px;
背景:白色;
背景:rgba(255255,0.9);
盒影:0.15px rgba(0,0,0,0.2);
边界半径:5px;
文本对齐:右对齐;
}
.头衔{
字号:18pt;
字体大小:粗体;
}
.src{
字号:10pt;
}
#删除,#导出{
位置:绝对位置;
顶部:100px;
右:10px;
z指数:100;
背景:白色;
颜色:黑色;
填充:6px;
边界半径:4px;
字体系列:“Helvetica Neue”;
光标:指针;
字体大小:12px;
文字装饰:无;
}
#出口{
顶部:130像素;
}
删除特征
/*****传单*****/
//基层
// .. 开放式街道地图
var osm=L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png',{attribute:'©;contributors'});
// .. 白色背景
var white=L.tileLayer(“数据:图像/png;base64,IVborw0kgoaaaansuheugaaaqaaaaaqaaabmvdolaaaa1bmvex//+nxbviaaaaah0leqvqyge3baq0aaadcipung43yaaaaaaaaaaaaaaaa5wihaaab9aaabjru5erkjggg=”;
//覆盖层(TMS)
var lyr1=L.tillelayer('./tiles/{z}/{x}/{y}.png',{tms:true,maxZoom:22,不透明度:0.9,属性:'});
//地图
var map=L.map('map'{
测量控制:正确,
中心:[-18.3604868606589,-52.694255477616245],
缩放:22,
最小缩放:0,
maxZoom:22,
图层:[osm]
});
1.添加到(地图);
//Geojson层
var basemaps={“OpenStreetMap”:osm,“无背景”:白色}
var overlaymap={“第1层”:lyr1}
//头衔
var title=L.control();
title.onAdd=函数(映射){
这个._div=L.DomUtil.create('div','ctl title');
这个.update();
把这个还给我;
};
title.update=功能(道具){
这是。_div.innerHTML=“FazMaraneyRGB_transparent_mosaic_group1”;
};
标题.地址(地图);
//注
var src='由Hawkit'生成';
var title=L.control({position:'bottomleft'});
title.onAdd=函数(映射){
这个.u div=L.DomUtil.create('div','ctl src');
这个.update();
把这个还给我;
};
title.update=功能(道具){
这个。_div.innerHTML=src;
};
标题.地址(地图);
var featureGroup=L.featureGroup().addTo(映射);
var drawControl=新的L.Control.Draw({
编辑:{
功能组:功能组
}
}).addTo(地图);
地图上('draw:created',函数(e){
//每次创建feaute时,都会将其添加到拱形要素组中
特性组。添加层(e层);
});
//单击后,清除所有图层
document.getElementById('delete')。onclick=function(e){
featureGroup.clearLayers();
}
document.getElementById('export')。onclick=function(e){
//从featureGroup中提取GeoJson
var data=featureGroup.toGeoJSON();
//将GeoJson字符串化
var convertedData='text/json;charset=utf-8',+encodeURIComponent(json.stringify(data));
//创建导出
document.getElementById('export').setAttribute('href','data:'+convertedData);
document.getElementById('export').setAttribute('download','data.geojson');
}
//添加基础层
图层(底图,覆盖图,{collapsed:true}).addTo(地图);
//拟合到覆盖边界(西南和东北点与(纬度、经度))
fitBounds地图([[-18.36827062251916,-52.6871074784942],-18.35270287637126,-52.70140284274223]);
该弹出窗口是由浏览器生成的,对于QWebEngine
我们必须创建它。要启动,必须检测到指示下载的信号,该信号是来自QWebEngineProfile
的downloadRequested
。该信号向我们发送一个处理下载的QWebEngineDownloadItem
对象,我们在QFileDialog
的帮助下在其中创建一个对话框窗口。对于这种情况,我们将创建一个自定义QWebEnginePage,如下所示:
index.html
FazMaraneyRGB_透明_马赛克_组1
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no' />
<title>FazMaraneyRGB_transparent_mosaic_group1</title>
<!-- Leaflet -->
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.5/leaflet.css" />
<script src="http://cdn.leafletjs.com/leaflet-0.7.5/leaflet.js"></script>
<!-- Leaflet.draw -->
<link rel="stylesheet" href="https://unpkg.com/leaflet-draw@0.4.1/dist/leaflet.draw.css" />
<script src="https://unpkg.com/leaflet-draw@0.4.1/dist/leaflet.draw.js"></script>
<!-- Leaflet Ajax -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet-ajax/2.1.0/leaflet.ajax.min.js"></script>
<!-- Leaflet Measument -->
<link rel="stylesheet" href="http://ljagis.github.io/leaflet-measure/leaflet-measure.css" />
<script src="http://ljagis.github.io/leaflet-measure/leaflet-measure.min.js"></script>
<style>
body { margin:0; padding:0; }
body, table, tr, td, th, div, h1, h2, input { font-family: "Calibri", "Trebuchet MS", "Ubuntu", Serif; font-size: 11pt; }
#map { position:absolute; top:0; bottom:0; width:100%; } /* full size */
.ctl {
padding: 2px 10px 2px 10px;
background: white;
background: rgba(255,255,255,0.9);
box-shadow: 0 0 15px rgba(0,0,0,0.2);
border-radius: 5px;
text-align: right;
}
.title {
font-size: 18pt;
font-weight: bold;
}
.src {
font-size: 10pt;
}
#delete, #export {
position: absolute;
top:100px;
right:10px;
z-index:100;
background:white;
color:black;
padding:6px;
border-radius:4px;
font-family: 'Helvetica Neue';
cursor: pointer;
font-size:12px;
text-decoration:none;
}
#export {
top:130px;
}
</style>
</head>
<body>
<div id='map'></div>
<div id='delete'>Delete Features</div>
<a href='#' id='export'>Export Features</a>
<script>
/* **** Leaflet **** */
// Base layers
// .. OpenStreetMap
var osm = L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'});
// .. White background
var white = L.tileLayer("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQAAAAEAAQMAAABmvDolAAAAA1BMVEX///+nxBvIAAAAH0lEQVQYGe3BAQ0AAADCIPunfg43YAAAAAAAAAAA5wIhAAAB9aK9BAAAAABJRU5ErkJggg==");
// Overlay layers (TMS)
var lyr1 = L.tileLayer('./tiles/{z}/{x}/{y}.png', {tms: true, maxZoom: 22, opacity: 0.9, attribution: ""});
// Map
var map = L.map('map', {
measureControl: true,
center: [-18.3604868606589, -52.694255477616245],
zoom: 22,
minZoom: 0,
maxZoom: 22,
layers: [osm]
});
lyr1.addTo(map);
//Geojson Layers
var basemaps = {"OpenStreetMap": osm, "Without background": white}
var overlaymaps = {"Layer 1": lyr1}
// Title
var title = L.control();
title.onAdd = function(map) {
this._div = L.DomUtil.create('div', 'ctl title');
this.update();
return this._div;
};
title.update = function(props) {
this._div.innerHTML = "FazMaraneyRGB_transparent_mosaic_group1";
};
title.addTo(map);
// Note
var src = 'Generated by Hawkit';
var title = L.control({position: 'bottomleft'});
title.onAdd = function(map) {
this._div = L.DomUtil.create('div', 'ctl src');
this.update();
return this._div;
};
title.update = function(props) {
this._div.innerHTML = src;
};
title.addTo(map);
var featureGroup = L.featureGroup().addTo(map);
var drawControl = new L.Control.Draw({
edit: {
featureGroup: featureGroup
}
}).addTo(map);
map.on('draw:created', function(e) {
// Each time a feaute is created, it's added to the over arching feature group
featureGroup.addLayer(e.layer);
});
// on click, clear all layers
document.getElementById('delete').onclick = function(e) {
featureGroup.clearLayers();
}
document.getElementById('export').onclick = function(e) {
// Extract GeoJson from featureGroup
var data = featureGroup.toGeoJSON();
// Stringify the GeoJson
var convertedData = 'text/json;charset=utf-8,' + encodeURIComponent(JSON.stringify(data));
// Create export
document.getElementById('export').setAttribute('href', 'data:' + convertedData);
document.getElementById('export').setAttribute('download','data.geojson');
}
// Add base layers
L.control.layers(basemaps, overlaymaps, {collapsed: true}).addTo(map);
// Fit to overlay bounds (SW and NE points with (lat, lon))
map.fitBounds([[-18.36827062251916, -52.6871074784942], [-18.35270287637126, -52.7014028427423]]);
</script>
</body>
</html>