main.js

import vjmap from "vjmap";
import "vjmap/dist/vjmap.min.css";

// ===== 按需修改：服务地址 / token / 地图 =====
// 本地部署的服务形如 http://localhost:27660/api/v1 ；官方云服务见 https://vjmap.com
const serviceUrl = import.meta.env.VITE_VJMAP_SERVICE_URL ?? "https://vjmap.com/server/api/v1";
const accessToken = import.meta.env.VITE_VJMAP_TOKEN ?? ""; // 生产填自己的 token；vite 只暴露 VITE_ 前缀
const mapid = "sys_zp"; // 换成你的 mapid

async function main() {
  const svc = new vjmap.Service(serviceUrl, accessToken);

  // 打开地图
  const res = await svc.openMap({
    mapid,
    mapopenway: vjmap.MapOpenWay.GeomRender, // 几何渲染方式打开
    style: vjmap.openMapDarkStyle(), // 深色背景样式；浅色用 openMapLightStyle()
  });
  if (res.error) {
    throw new Error(res.error); // 打开失败先报错
  }

  // res.bounds 是字符串，先转成 GeoBounds
  const mapExtent = vjmap.GeoBounds.fromString(res.bounds);
  // CAD 坐标 → 渲染坐标 的投影
  const prj = new vjmap.GeoProjection(mapExtent);

  const map = new vjmap.Map({
    container: "map",
    style: svc.rasterStyle(), // 栅格样式；也可用 svc.vectorStyle()
    center: prj.toLngLat(mapExtent.center()), // CAD 中心 → 渲染坐标
    zoom: 2,
    renderWorldCopies: false, // 不显示多屏地图
    doubleClickZoom: false,
  });
  map.attach(svc, prj);
  await map.onLoad();
  // map.fitMapBounds(); // 需要整图显示时打开

  // 覆盖物 / 交互 从这里开始……
  console.log("map ready", res.mapid);
}

// vite 默认构建 target 不支持顶层 await，包一层 async main
main().catch(console.error);