唯杰地图 logo唯杰地图
VJMAP
EN

export-formats

vjmap/references/backend/export-formats.md 3.4 KB104 行
原文

本文回答:PDF / PNG / GeoJSON / ForgeViewer 等非 DWG 的导出方式。

一、导出 PDF

const param = {
  lineWeight: false,
  bIncludeOffLayers: false,
  bSearchableSHX: false,
  bSearchableTTF: false,
  pageWidth: 210,           // A4 宽 mm
  pageHeight: 297,          // A4 高 mm
  pageLeftMargin: 0,
  pageRightMargin: 0,
  pageTopMargin: 0,
  pageBottomMargin: 0,
  geomDPI: 600,             // 矢量 DPI
  colorImagesDPI: 400,      // 图像 DPI
  isBlackWhiteMode: false,
  isGrayMode: false
};

const result = await svc.execCommand("exportPdf", param, mapid, version, true);
if (result.error) throw new Error(result.error);

const pdfUrl = svc.baseUrl() + result.path + "?token=" + svc.accessToken;
window.open(pdfUrl);

先变换再导出

同 export-dwg 第四节:composeNewMap → updateMap → exportPdf。

二、导出 PNG / JPG(WMS)

用 svc.wmsTileUrl 构造图片 URL:

async function exportPng() {
  // Memory 方式打开的图 cmdGetDrawBounds 恒返回 null(仅几何库实现),须回退
  const bounds = (await svc.cmdGetDrawBounds()) ?? svc.currentMapParam().drawBounds;
  const scaled = bounds.scale(1.01);     // 留边框

  const pictureWidth = 1024;
  const wmsUrl = svc.wmsTileUrl({
    width: pictureWidth,
    height: Math.round(pictureWidth * scaled.height() / scaled.width()),
    srs: "",                           // 置空:CAD 范围直接出图,不做坐标系转换
    bbox: scaled.toString(),
    transparent: true
    // ⚠️ 要黑底不透明图:transparent:false + backgroundColor:"rgb(0,0,0)"
    //    (backgroundColor 只在不透明时生效,透明时会被忽略)
  });

  window.open(wmsUrl);                   // 直接在新窗口打开
}

导出特定范围:把 cmdGetDrawBounds() 换成自定义 vjmap.GeoBounds.fromArray([x1,y1,x2,y2])。

preserveDrawingBuffer 模式

当前页面画布转 base64:

const map = new vjmap.Map({ ..., preserveDrawingBuffer: true });
const dataUrl = map.getCanvas().toDataURL("image/png");

三、导出 GeoJSON(自行序列化查询结果)

const q = await svc.conditionQueryFeature({
  condition: "name='7'",                       // 所有圆
  fields: "objectid,center,radius,geojson",    // 指定 fields 时必须含 geojson,否则没有 r.geojson
  includegeom: true, realgeom: true,           // 真实几何(只传 realgeom 不生效)
  toMapCoordinate: true,                       // geojson 用 CAD 坐标(缺省为墨卡托)
  limit: 100000
});

const fc = {
  type: "FeatureCollection",
  features: (q.result ?? []).filter(r => r.geojson).map(r => ({
    type: "Feature",
    geometry: JSON.parse(r.geojson),
    properties: { id: r.objectid, radius: r.radius }
  }))
};

// 下载
const blob = new Blob([JSON.stringify(fc)], { type: "application/json" });
const a = document.createElement("a");
a.href = URL.createObjectURL(blob);
a.download = "circles.geojson";
a.click();

四、常见坑

  1. PDF 中文乱码 → 服务端需配字体(SHX / TTF)。检查 data/fonts/。
  2. PNG 内容一半空白 → bbox 的范围小于实际绘图范围,或 bbox 坐标系错。优先用 cmdGetDrawBounds + scale(1.01)(Memory 图它返回 null,回退 currentMapParam().drawBounds)。