# Export
# Export PDF
Export PDF online demo (opens new window)
let mapid; // If not set, use the default from above
let version; // If not set, use the default from above
let param; // If not set, use default
/*
param = {
lineWeight: false, // Whether to include line weight when exporting
bIncludeOffLayers: false, // Whether to include closed layers
bSearchableSHX: false, // Searchable SHX text
bSearchableTTF: false, // Searchable TTF text
pageWidth: 210, // Width in mm
pageHeight: 297, // Height in mm
pageLeftMargin: 0, // Left margin (effective when pageWidth, pageHeight are set)
pageRightMargin: 0, // Right margin (effective when pageWidth, pageHeight are set)
pageTopMargin: 0, // Top margin (effective when pageWidth, pageHeight are set)
pageBottomMargin: 0, // Bottom margin (effective when pageWidth, pageHeight are set)
geomDPI: 600, // Vector DPI
colorImagesDPI: 400, // Image DPI
isBlackWhiteMode: false, // Whether to export in black and white mode
isGrayMode: false, // Whether to export in gray mode
}*/
// Export PDF
const exportPdf = async () => {
message.info("Exporting PDF, please wait...")
const result = await svc.execCommand("exportPdf", param, mapid, version, true);
if (result.error) {
message.error(result.error)
} else {
let pdfUrl = svc.baseUrl() + result.path + "?token=" + svc.accessToken;
window.open(pdfUrl, )
}
}
// You can also process the drawing before exporting, e.g. rotate 90 degrees then export
/*
// Export PDF
const exportPdf = async () => {
message.info("Exporting PDF, please wait...")
let composeRes = await svc.composeNewMap({
mapid: 'cbf527ed3ad1',
version: 'v1',
fourParameter: [0, 0, 1, -Math.PI / 2]
})
let res = await svc.updateMap({
// Get a temporary map id (temporary maps are for viewing only, will be auto-deleted when expired)
mapid: vjmap.getTempMapId(1), // Auto-delete time when not browsing, in minutes. Default 30
fileid: composeRes.fileid, // Generated fileid
mapopenway: vjmap.MapOpenWay.Memory,
style: {
backcolor: 0 // If div background is light, set to 0xFFFFFF
}
})
const result = await svc.execCommand("exportPdf", param, res.mapid, res.version, true);
if (result.error) {
message.error(result.error)
} else {
let pdfUrl = svc.baseUrl() + result.path + "?token=" + svc.accessToken;
window.open(pdfUrl, )
}
}
*/
<mapFrameEx>
<pre>
// Map service object
let svc = new vjmap.Service(env.serviceUrl, env.accessToken)
// Open map
let res = await svc.openMap({
mapid: env.exampleMapId, // Map ID
mapopenway: vjmap.MapOpenWay.GeomRender, // Open with geometry render mode
style: vjmap.openMapDarkStyle() // When div has dark background, pass dark background style here
})
if (res.error) {
// If open fails
message.error(res.error)
}
// Create geometric projection coordinate system based on map bounds
let prj = new vjmap.GeoProjection(res.bounds);
// Map object
let map = new vjmap.Map({
container: 'map', // DIV container ID
style: svc.rasterStyle(), // Style, raster style here
center: prj.toLngLat(prj.getMapExtent().center()), // Set map center
zoom: 1, // Set map zoom level
renderWorldCopies: false
});
// Associate service object and projection object
map.attach(svc, prj);
await map.onLoad();
const exportPdf = async () => {
map.logInfo("Exporting PDF, please wait...")
let param;
const result = await svc.execCommand("exportPdf", param, env.exampleMapId, "v1", true);
if (result.error) {
map.logInfo(result.error, "error")
} else {
let pdfUrl = svc.baseUrl() + result.path + "?token=" + svc.accessToken;
window.open(pdfUrl, )
}
}
// Add a button
let options = {};
options.buttons = [
{
id: "pdf",
title: "Export to PDF",
text: "Export Pdf",
onActivate: (ctx, e) => {
exportPdf()
}
}
];
let btnGroupCtrl = new vjmap.ButtonGroupControl(options);
map.addControl(btnGroupCtrl, 'top-right');
</pre>
</mapFrameEx>
<br/>
<br/>
## Export Image
Export images using the map service's `WMS` tile service
```ts
/**
* WMS service URL interface
*/
export interface IWmsTileUrl {
/** Map ID (empty uses current mapid), array for multiple requests. */
mapid?: string | string[];
/** Map version (empty uses current version). */
version?: string | string[];
/** Layer name (empty uses current map layer). */
layers?: string | string[];
/** Bounds, default {bbox-epsg-3857}. (To get WMS data for a CAD range without coordinate conversion, fill CAD range, leave srs, crs, mapbounds empty).*/
bbox?: string;
/** Current coordinate system, default (EPSG:3857). */
srs?: string;
/** CAD map coordinate system, empty uses metadata. Can also input proj4 string*/
crs?: string | string[];
/** Geographic bounds, when set srs is ignored */
mapbounds?: string;
/** Width. */
width?: number;
/** Height. */
height?: number;
/** Whether transparent. */
transparent?: boolean;
/** Background color when not transparent, default white. Format must be rgb(r,g,b) or rgba(r,g,b,a), a for opacity should be 255. */
backgroundColor?: string;
/** Four parameters (x offset, y offset, scale, rotation radians), optional, for final coordinate correction*/
fourParameter?: string | string[];
/** Whether to use inverse of above four parameters, default false*/
isInverseFourParamter?: boolean | boolean[];
/** Whether vector tiles. */
mvt?: boolean;
/** Whether to consider rotation when converting between coordinate systems. Default auto. */
useImageRotate?: boolean;
/** Image processing algorithm when rotating. 1 or 2, default auto (useful when rotating)*/
imageProcessAlg?: number;
/** Current web map type WGS84 (84 coords, e.g. Tianditu, OSM), GCJ02 (Mars coords, e.g. Amap, Tencent), BD09LL (Baidu lnglat, e.g. Baidu), BD09MC (Baidu Mercator, e.g. Baidu)*/
webMapType?: "WGS84" | "GCJ02" | "BD09LL" | "BD09MC";
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
Sample code
const exportMapPngByBoundsUrl = points => {
let bounds = vjmap.GeoBounds.fromDataExtent(points);
bounds = map.fromLngLat(bounds);
// bounds = bounds.square(); // Ensure square
bounds = bounds.scale(1.01); // Slightly larger so border lines don't disappear
let pictureWidth = 1024 ;// Export image width/height
let wmsUrl = svc.wmsTileUrl({
width: pictureWidth,
height: Math.round(pictureWidth * bounds.height() / bounds.width()),
srs: "",
bbox: bounds.toString(),
transparent: false,
backgroundColor: 'rgb(0,0,0)'
});
window.open(wmsUrl);
};
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
# Export DXF
const result = await svc.execCommand("exportDxf", {}, mapid, version, true);
1
Note
Due to data security, the trial version cannot download exported DXF files. The full version can enable download in the backend. Download based on the returned fileid (under mapfiles directory) and configured download path.