基于vue3+ts搭建的搭配可视化项目，使用image2d、image3d、echart等多种绘图方式支持。

本项目导出的json可以使用json-to-dataview打包成一个微小的发布项目~

使用的时候遇到任何问题或有好的建议，请点击进入issue，欢迎参与维护！

首先，你需要确保本地安装了node.js，然后，执行下面命令安装项目依赖：

npm install

接着，启动下面命令会自动打开页面，修改内容页面也自动刷新：

npm run dev

如果你想发布开发的代码，执行下面命令进行打包：

npm run build

为了方便使用，我们对依赖的库或别的依赖进行了二次封装：

• EChart ：用于提供常用的图表
• Image2D ：绘制一些特殊的图表
• Image3D ：用于个性化的3D图形绘制

为了方便弹框的实现，我们进行了统一的设计（下面，我们以alert弹框为例来说明）。

首先，你需要准备好弹框的模板，很简单，在src/dialogs下新建一个.vue文件即可。

打卡warning.vue文件，可以看见，里面的内容是通过data来接收的，这个数据也就是调用这个弹框的时候传递的initdata这项。

当然，新建完毕后，别忘了在src/dialogs/lazy-load.ts中进行懒加载注册。

现在，已经可以使用这个弹框了，在这里，使用的例子就是：

this.$store.commit('openDialog', {
    id: "warning",
    initdata: ['alert', "你刚刚进行的操作成功了", "温馨提示", "确定"],
    callback: function () {
       // 回调
    }
});

对于普通的弹框，到这里就可以了，不过，由于alert等比较特殊，经常使用到，由此，我们对一些常用的，进行了更简单的封装，下面列举一下：

• this.$alert(msg, title, funPos) ：一些小提示
• this.$confirm(title, msg, actionPos, actionNeg, mesPos, mesNeg)：确认提示

首先，你需要在src/components/下的border和chart下方便新增需要的组件，然后在对应的lazy-load.ts中进行引入。

此时，页面中已经可以使用这些组件了，只不过，为了在选中配置界面可选，还需要在config/下的border和chart文件夹中进行登记。

比如echart中配置地图的话，需要提前安装对应的geoJSON包，如果还没有安装，可以去datapool中寻找，如果没有找到，可以去issue给留言说明。

按照好了以后，就需要去./src/map-lazy.js中添加，添加完毕后，比如香港：

export default {
    hk: () => import('@datapool/hk.geojson')
};

然后，echart这样配置就可以使用了：

{
    ......
    type: "map",
    map: "hk",
}

有任何疑惑都可以去给我们留言哦~，当然，也欢迎你帮助我们改进此项目。

MIT

Copyright (c) 2022 hai2007 走一步，再走一步。