Export

Export PDF

Export PDF online demo

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, )
    }
}
*/



VJDEMO0


<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";
}

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);
};

// 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 exportPng = async () => {
    let bounds = await svc.cmdGetDrawBounds(); // CAD drawing visible bounds (range with content)
    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: true,
        backgroundColor: 'rgb(0,0,0)'
    });
    window.open(wmsUrl);
}
// Add a button
let options = {};
options.buttons = [
    {
        id: "pdf",
        title: "Export Image",
        text: "Export Image",
        onActivate: (ctx, e) => {
            exportPng()
        }
    }
];
let btnGroupCtrl = new vjmap.ButtonGroupControl(options);
map.addControl(btnGroupCtrl, 'top-right');

Export DXF

const result = await svc.execCommand("exportDxf", {}, mapid, version, true);

:::tip 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. :::