最新技术栈Vue3+TS基于唯杰地图开发的CAD云端图纸管理平台案例代码开源了

系统介绍

唯杰地图云端图纸管理平台 利用最新技术栈Vue+TypeScript基于唯杰地图二次开发的系统。

实现了对AutoCAD格式的DWG图纸的云端管理查看功能。

大致功能如下:

  • CAD图纸的在线上传、打开、查看、版本管理
  • 在线图层管理切换查看功能
  • 属性数据查询功能
  • 图中文字搜索功能
  • 视图管理功能
  • 打印功能,可输出PNG、JPG、PDF、SVG等功能
  • 在线绘图功能,(点,线,面,捕捉、裁剪等功能)
  • 图纸批注功能
  • 自定义样式更改功能
  • 数据展示功能 【重点推荐】,允许用户模拟点数据、在图上捕捉采集点、线、面数据、或者直接选择实体数据,根据数据,选择不同的绘制方式把数据展示在图上。

在线免费体验地址: https://vjmap.com/app/cloud

案例源码可免费下载!!!

技术栈

  • 前端框架 Vue3

  • 开发语言 TypeScript

  • 打包工具 Vite

  • 界面库 Element plus

  • 状态管理 Pinia

功能介绍

CAD图纸的在线上传、打开、查看、版本管理

image-20220306184355126

上传成功后,取个图名称ID

image-20220306184730008

在线图层管理切换查看功能

image-20220306193805420

属性数据查询功能

image-20220306193844388

图中文字搜索功能

image-20220306193925867

视图管理功能

image-20220306193947991

打印功能,可输出PNG、JPG、PDF、SVG等功能

image-20220306194007331

在线绘图功能,(点,线,面,捕捉、裁剪等功能)

image-20220306194108822

图纸批注功能

image-20220306194428223

自定义样式更改功能

image-20220306194506354

数据展示功能 【重点推荐】

允许用户模拟点数据、在图上捕捉采集点、线、面数据、或者直接选择实体数据,根据数据,选择不同的绘制方式把数据展示在图上。

image-20220306194555754

数据来源支持

  • 随机数据
  • 图上捕捉拾取点
  • 采集线(可捕捉图上的坐标点)
  • 采集多边形(可捕捉图上的坐标点)
  • 选择图上的实体,返回位置坐标数据
  • 选择图上的实体,返回渲染的几何坐标数据

绘制方式支持如下:

  • image-20220306194930558
  • 线

    image-20220306200138186
  • image-20220306200147920
  • 其他

    image-20220306200159175

    使用上述工具,可以方便快捷的把数据用所需要的效果展示出来。效果如下:

    datadisplay.gif

唯杰地图介绍

唯杰地图VJMAPCAD图或自定义地图格式WebGIS可视化显示开发提供的一站式解决方案,支持的格式如常用的AutoCADDWG格式文件、GeoJSON等常用GIS文件格式,它使用WebGL矢量图块自定义样式呈现交互式地图, 提供了全新的大数据可视化实时流数据可视化功能,通过本产品可快速实现浏览器和移动端上美观、流畅的地图呈现与空间分析,可帮助您在网站中构建功能丰富、交互性强、可定制的地图应用。

唯杰地图官网地址:https://vjmap.com/

特点

  • 完全兼容AutoCAD格式的DWG文件,无需转换
  • 绘图技术先进:采用WebGL技术,支持矢量地图渲染,支持栅格、图片、视频等图形渲染,支持3D模型渲染;
  • 个性化地图:服务端渲染和前端渲染都支持自定义样式表达式,灵活强大;
  • 多视角模式:支持2D、3D视角,支持垂直视角、360度旋转视角;
  • 视觉特性:支持无极缩放、支持粒子、航线等动画效果、支持飞行、平移等运动特效;
  • 功能完善:支持所有常见的地图功能,提供丰富的js接口;
  • 交互控制:支持鼠标/单指拖拽、上下左右按键进行地图平移,支持鼠标滚轮、双击、双指进行地图缩放,支持Shift+拉框放大;
  • 大数据可视化:性能卓越,支持大数据可视化展示
  • 跨平台支持(支持windows,linux); 支持docker部署;支持私有化部署;支持桌面端语言开发(如C#JavaC++语言)

本文章由javascript技术分享原创和收集

发表评论 (审核通过后显示评论):