Commit 3f8dccdc authored by youjie's avatar youjie

no message

parent dfbacbb0
<template> <template>
<div class="tripmap-form marginT20" v-if="dataAll"> <div class="tripmap-form marginT20" v-if="dataAll">
<div class="row"> <div class="row"
v-loading="setLoading">
<div <div
v-for="(x, index) in TripMapList" v-for="(x, index) in TripMapList"
::key="x.Id" ::key="x.Id"
...@@ -87,6 +88,7 @@ export default { ...@@ -87,6 +88,7 @@ export default {
props: ["dataAll", "ConfigId"], props: ["dataAll", "ConfigId"],
data() { data() {
return { return {
setLoading: false,
imageUrl: "", imageUrl: "",
deviceMarkers: [], deviceMarkers: [],
loadingCity: false, loadingCity: false,
...@@ -202,6 +204,7 @@ export default { ...@@ -202,6 +204,7 @@ export default {
container: "trip_map", container: "trip_map",
style: "mapbox://styles/alex9012/clm92pvs1011j01qzexlh6g2b", // 'mapbox://styles/mapbox/light-v9','mapbox://styles/alex9012/clm92pvs1011j01qzexlh6g2b' style: "mapbox://styles/alex9012/clm92pvs1011j01qzexlh6g2b", // 'mapbox://styles/mapbox/light-v9','mapbox://styles/alex9012/clm92pvs1011j01qzexlh6g2b'
center: [2.177432, 41.382894], center: [2.177432, 41.382894],
zoom: 6,
preserveDrawingBuffer: true preserveDrawingBuffer: true
}); });
this.map.on("load", async () => { this.map.on("load", async () => {
...@@ -242,13 +245,29 @@ export default { ...@@ -242,13 +245,29 @@ export default {
}, },
methods: { methods: {
getResultImg() { getResultImg() {
this.setLoading = true
let that = this
var postJson = {
ConfigId: this.ConfigId,
};
this.imageUrl = this.map.getCanvas().toDataURL("image/png"); this.imageUrl = this.map.getCanvas().toDataURL("image/png");
let mapCanvas = document.querySelector(".mapboxgl-canvas"); let mapCanvas = document.querySelector(".mapboxgl-canvas");
// mapCanvas.style.display = "none"; // mapCanvas.style.display = "none";
html2Canvas(document.getElementById('trip_map')).then(function(canvas) { html2Canvas(document.getElementById('trip_map')).then(function(canvas) {
var image = document.createElement("a"); //image.href = canvas.toDataURL("image/jpeg").replace("image/jpeg", "image/octet-stream"); var image = document.createElement("a"); //image.href = canvas.toDataURL("image/jpeg").replace("image/jpeg", "image/octet-stream");
image.href = canvas.toDataURL("image/png"); image.href = canvas.toDataURL("image/png");
console.log(image.href,'=========') let blob = that.base64ToBlob(image.href);
let newArr = [];
newArr.push(blob);
var path = `/Upload/Temporary`;
that.uploadSelfBlob(path, newArr,postJson, x => {
if(x.data.StatusCode==1){
let allPath = that.domainManager().ViittoFileUrl + x.data.FilePath;
// console.log(allPath,'------')
}
that.setLoading = false
})
return
image.download = "map.png"; image.download = "map.png";
image.click(); image.click();
}); });
...@@ -308,16 +327,12 @@ export default { ...@@ -308,16 +327,12 @@ export default {
// 获取坐标信息 // 获取坐标信息
await this.calcCitiesGeoInfoHandler(); await this.calcCitiesGeoInfoHandler();
//console.log(this.citiesData)
console.log(this.map);
// 可见范围 // 可见范围
const bounds = new mapboxgl.LngLatBounds(); const bounds = new mapboxgl.LngLatBounds();
this.citiesData.forEach(city => { this.citiesData.forEach(city => {
bounds.extend([city.longitude, city.latitude]); bounds.extend([city.longitude, city.latitude]);
}); });
console.log(bounds);
this.map.fitBounds(bounds); this.map.fitBounds(bounds);
console.log(bounds,'========bounds')
this.map.setCenter(bounds.getCenter()); this.map.setCenter(bounds.getCenter());
this.addMarker(); //标记 this.addMarker(); //标记
this.createLineHandler(); //连线 this.createLineHandler(); //连线
...@@ -691,13 +706,13 @@ export default { ...@@ -691,13 +706,13 @@ export default {
} }
#trip_map { #trip_map {
width: 100%; width: 100%;
/* height: 500px; */ height: 500px;
position: absolute; position: absolute;
/* position: fixed; */
top: 0; top: 0;
bottom: 0; bottom: 0;
left: 0; left: 0;
right: 0; right: 0;
position: fixed;
background: #FFF; background: #FFF;
z-index: 5000; z-index: 5000;
} }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment