diff --git a/packages/api/src/controllers/files.js b/packages/api/src/controllers/files.js
index ddeda85b4..484429db5 100644
--- a/packages/api/src/controllers/files.js
+++ b/packages/api/src/controllers/files.js
@@ -8,6 +8,7 @@ const socket = require('../utility/socket');
const scheduler = require('./scheduler');
const getDiagramExport = require('../utility/getDiagramExport');
const apps = require('./apps');
+const getMapExport = require('../utility/getMapExport');
function serialize(format, data) {
if (format == 'text') return data;
@@ -187,6 +188,12 @@ module.exports = {
return true;
},
+ exportMap_meta: true,
+ async exportMap({ filePath, geoJson }) {
+ await fs.writeFile(filePath, getMapExport(geoJson));
+ return true;
+ },
+
exportDiagram_meta: true,
async exportDiagram({ filePath, html, css, themeType, themeClassName }) {
await fs.writeFile(filePath, getDiagramExport(html, css, themeType, themeClassName));
diff --git a/packages/api/src/utility/getMapExport.js b/packages/api/src/utility/getMapExport.js
new file mode 100644
index 000000000..a4f7608c9
--- /dev/null
+++ b/packages/api/src/utility/getMapExport.js
@@ -0,0 +1,76 @@
+const getMapExport = (geoJson) => {
+ return `
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ `;
+};
+
+module.exports = getMapExport;
diff --git a/packages/web/src/elements/MapView.svelte b/packages/web/src/elements/MapView.svelte
index 9a27766d4..2a45e8ef6 100644
--- a/packages/web/src/elements/MapView.svelte
+++ b/packages/web/src/elements/MapView.svelte
@@ -22,8 +22,13 @@
import 'leaflet/dist/leaflet.css';
import leaflet from 'leaflet';
import wellknown from 'wellknown';
- import { isWktGeometry } from 'dbgate-tools';
+ import { isWktGeometry, ScriptWriter, ScriptWriterJson } from 'dbgate-tools';
import resizeObserver from '../utility/resizeObserver';
+ import openNewTab from '../utility/openNewTab';
+ import contextMenu from '../utility/contextMenu';
+ import { saveExportedFile, saveFileToDisk } from '../utility/exportFileTools';
+ import { getCurrentConfig } from '../stores';
+ import { apiCall } from '../utility/api';
export let selection;
@@ -31,6 +36,7 @@
let map;
let selectionLayers = [];
+ let geoJson;
function createColumnsTable(cells) {
return `${cells.map(cell => `| ${cell.column} | ${cell.value} |
`).join('\n')}
`;
@@ -87,7 +93,7 @@
return;
}
- const geoJson = {
+ geoJson = {
type: 'FeatureCollection',
features,
};
@@ -107,10 +113,10 @@
return leaflet.circleMarker(latlng, {
radius: 7,
weight: 2,
- fillColor: '#ff7800',
- color: '#ff7800',
- opacity: 0.8,
- fillOpacity: 0.4,
+ fillColor: '#ff0000',
+ color: '#ff0000',
+ opacity: 0.9,
+ fillOpacity: 0.9,
});
},
onEachFeature: (feature, layer) => {
@@ -151,10 +157,40 @@
selection;
addSelectionToMap();
}
+
+ function createMenu() {
+ return [
+ {
+ text: 'Open on new tab',
+ onClick: () => {
+ openNewTab({
+ title: 'Map',
+ icon: 'img map',
+ tabComponent: 'MapTab',
+ props: {
+ selection,
+ },
+ });
+ },
+ },
+ {
+ text: 'Save to file',
+ onClick: () => {
+ saveFileToDisk(async filePath => {
+ await apiCall('files/export-map', {
+ geoJson,
+ filePath,
+ });
+ });
+ },
+ },
+ ];
+ }
{