前端通过JavaScript创建修改CAD图形 前端通过JavaScript创建修改CAD图形详情

(async () => {
 // --新建地图--在后台新建CAD图，然后在前端打开
 // js代码
 let svc = new vjmap.Service(env.serviceUrl, env.accessToken)
 let doc = new vjmap.DbDocument();
 let entitys = [];
 let line1 = new vjmap.DbLine();
 line1.start = [0, 0]
 line1.end = [0, 15]
 entitys.push(line1)
 
 let line2 = new vjmap.DbLine();
 line2.start = [0, 14.1]
 line2.end = [2.99, 14.1]
 entitys.push(line2)
 
 let line3 = new vjmap.DbLine();
 line3.start = [0, 0.9]
 line3.end = [2.99, 0.9]
 entitys.push(line3)
 
 let line4 = new vjmap.DbLine();
 line4.start = [0, 9.95]
 line4.end = [5.8, 9.95]
 entitys.push(line4)
 
 let line5 = new vjmap.DbLine();
 line5.start = [0, 5.05]
 line5.end = [5.8, 5.05]
 
 let hatch = new vjmap.DbHatch();
 hatch.pattern = "SOLID";
 hatch.color = 0xB43F32;
 hatch.points = [line4.start, line4.end, line5.end, line5.start];
 entitys.push(hatch);
 entitys.push(line4)
 entitys.push(line5)
 
 let line6 = new vjmap.DbLine();
 line6.start = [5.8, 5.05]
 line6.end = [5.8, 9.95]
 entitys.push(line6)
 
 let arc1 = new vjmap.DbArc();
 arc1.center = [5.7963, 7.504];
 arc1.radius = 1.8014;
 arc1.startAngle = 270 * Math.PI / 180.0;
 arc1.endAngle = 90 * Math.PI / 180.0;
 entitys.push(arc1)
 
 let arc2 = new vjmap.DbArc();
 arc2.center = [5.7963, 7.504];
 arc2.radius = 1.8014;
 arc2.startAngle = 90 * Math.PI / 180.0;
 arc2.endAngle = 270 * Math.PI / 180.0;
 //arc2.linetype = "DASHED"
 entitys.push(arc2)
 
 let arc3 = new vjmap.DbArc();
 arc3.center = [1.575, 7.5];
 arc3.radius = 6.75;
 arc3.startAngle = 282 * Math.PI / 180.0;
 arc3.endAngle = 78 * Math.PI / 180.0;
 entitys.push(arc3)
 
 let block = new vjmap.DbBlock();
 block.name = "ball";
 block.origin = [0, 0]
 block.entitys = entitys;
 doc.appendBlock(block);
 
 let blockRef1 = new vjmap.DbBlockReference();
 blockRef1.blockname = "ball";
 blockRef1.position = [0, 0];
 doc.appendEntity(blockRef1);
 
 let blockRef2 = new vjmap.DbBlockReference();
 blockRef2.blockname = "ball";
 blockRef2.position = [28, 15];
 blockRef2.rotation = Math.PI;
 doc.appendEntity(blockRef2);
 
 let otherEnts = [
  new vjmap.DbLine({
   start: [0, 15],
   end: [28, 15]
  }),
  new vjmap.DbLine({
   start: [0, 0],
   end: [28, 0]
  }),
  new vjmap.DbLine({
   start: [14, 0],
   end: [14, 15],
   colorIndex: 1
  }),
  new vjmap.DbCircle({
   center:[14, 7.5],
   radius: 1.83,
   color: 0xFF0000
  }),
  new vjmap.DbText({
   position: [14, 16],
   contents: "篮球场示意图",
   colorIndex: 1,
   horizontalMode: 4,
   height: 1,
  })
 ]
 
 doc.appendEntity(otherEnts);
 
 // js代码
 let res = await svc.updateMap({
  mapid: "basketballCourt",
  filedoc: doc.toDoc(),
  mapopenway: vjmap.MapOpenWay.Memory,
  style: vjmap.openMapDarkStyle() // div为深色背景颜色时，这里也传深色背景样式
 })
 if (res.error) {
  message.error(res.error)
 }
 let mapExtent = vjmap.GeoBounds.fromString(res.bounds);
 let prj = new vjmap.GeoProjection(mapExtent);
 
 var map = new vjmap.Map({
  container: 'map', // container ID
  style: svc.rasterStyle(),
  center: prj.toLngLat(mapExtent.center()),
  zoom: 2,
  renderWorldCopies: false
 });
 map.attach(svc, prj);
 map.fitMapBounds();
 
 map.addControl(new vjmap.NavigationControl());
 map.addControl(new vjmap.MousePositionControl({showZoom: true}));
 
 map.enableLayerClickHighlight(svc, e => {
  e && message.info(`type: ${e.name}, objectid: ${e.objectid}, layer: ${e.layerindex}`);
 })
})();

let doc = new vjmap.DbDocument();
/** 来源于哪个图，会在此图的上面进行修改或新增删除，格式如 形式为 mapid/version,如 exam/v1 . */
doc.from = "basketballCourt/v1";
 
// 修改或删除实体是通过传递 `objectid` 实体句柄，如果没有 `objectid` 则表示新增
let modifyEnts = [
    /*修改*/
    new vjmap.DbCircle({
        objectid: "71",// 实体句柄，如传了实体句柄，是表示修改或删除此实体. 
        colorIndex: 2
    }),
    /*删除*/
    new vjmap.DbText({
        objectid: "73",// 实体句柄，如传了实体句柄，是表示修改或删除此实体. 
        delete: true // 表示删除
    }),
    /*新增(没有传 objectid )*/
    new vjmap.DbMText({
        position: [14, -2],
        contents: "我是多行文本",
        colorIndex: 3,
        attachment: 2,
        height: 1,
    })
]
doc.appendEntity(modifyEnts);
 
// js代码
let res = await svc.updateMap({
    mapid: "newBasketballCourt",
    filedoc: doc.toDoc(),
    mapopenway: vjmap.MapOpenWay.Memory,
    style: vjmap.openMapDarkStyle() // div为深色背景颜色时，这里也传深色背景样式
})