开源精美！一款拖拽式的可视化数据大屏设计低代码平台！
<p>大家好，我是 <code>Java陈序员</code>。</p><p>之前给大家介绍了几款可视化数据大屏设计工具。</p>
<p>大屏设计器，就它了！</p>
<p>酷炫大屏展示！一个完全开源的BI平台！</p>
<p>零门槛！人人可用的开源 BI 工具！</p>
<p>今天，再给大家介绍一款开源精美、纯拖拽式的可视化数据大屏设计低代码平台！</p>
<blockquote>
<p>关注微信公众号：【Java陈序员】，获取<strong>开源项目分享、AI副业分享、超200本经典计算机电子书籍等。</strong></p>
</blockquote>
<h2 id="项目介绍">项目介绍</h2>
<p><code>go-view</code> —— 一个低代码数据可视化开发平台，将图表或页面元素封装为基础组件，无需编写代码即可完成业务需求。</p>
<p><strong>功能特色</strong>：</p>
<ul>
<li><strong>可视化画布操作</strong>：通过鼠标拖拽基础组件（图表、文本、容器等）到画布，实时预览布局效果，无需编写 HTML/CSS/JS 代码，非技术人员也能快速上手。</li>
<li><strong>组件化封装体系</strong>：将数据可视化常用元素（如折线图、柱状图、地图、仪表盘等）封装为可复用组件，支持一键调用、属性配置（颜色、尺寸、交互逻辑等）。</li>
<li><strong>数据绑定可视化</strong>：通过图形化界面配置数据源（API 接口、静态数据、数据库连接等），一键关联组件与数据字段，自动生成数据驱动的可视化效果</li>
</ul>
<p><strong>技术栈</strong>：</p>
<ul>
<li>Java</li>
<li>MyBatis Plus</li>
<li>SqlLite</li>
<li>Vue3</li>
<li>TypeScript4</li>
<li>NaiveUI</li>
<li>ECharts5</li>
<li>PlopJS</li>
</ul>
<h2 id="系统截图">系统截图</h2>
<ul>
<li><strong>项目列表</strong></li>
</ul>
<p><img src="https://create-center.oss-cn-shenzhen.aliyuncs.com/go-view/img-20250626205639.png"></p>
<ul>
<li><strong>工作台</strong></li>
</ul>
<p><img src="https://create-center.oss-cn-shenzhen.aliyuncs.com/go-view/img-20250626205853.png"></p>
<p><img src="https://create-center.oss-cn-shenzhen.aliyuncs.com/go-view/img-20250626210401.png"></p>
<p><img src="https://create-center.oss-cn-shenzhen.aliyuncs.com/go-view/img-20250626210437.png"></p>
<ul>
<li><strong>动态数据</strong></li>
</ul>
<p><img src="https://create-center.oss-cn-shenzhen.aliyuncs.com/go-view/img-20250626205932.png"></p>
<ul>
<li><strong>预览</strong></li>
</ul>
<p><img src="https://create-center.oss-cn-shenzhen.aliyuncs.com/go-view/img-20250626210040.png"></p>
<ul>
<li><strong>主题颜色选择</strong></li>
</ul>
<p><img src="https://create-center.oss-cn-shenzhen.aliyuncs.com/go-view/img-20250626210511.png"></p>
<h2 id="本地开发">本地开发</h2>
<h3 id="后端服务">后端服务</h3>
<p>1、克隆代码</p>
<pre><code class="language-bash">git clone https://gitee.com/MTrun/go-view-serve.git
</code></pre>
<p>2、将项目以 Maven 工程的形式导入到 IDEA</p>
<p>3、修改配置文件 <code>go-view-serve/src/main/resources/application-dev.yml</code> 中的数据库连接地址</p>
<pre><code class="language-yaml">spring:
datasource:
driver-class-name: org.sqlite.JDBC
# url: jdbc:sqlite:D:\\eclipse-workspace\v2-goview-bate\sqllite\goview.db
# 数据库地址改为 goview.db 文件的本地地址
url: jdbc:sqlite:D:\\JavaEE\\github\\go-view-serve\\sqllite\\goview.db
</code></pre>
<p>4、运行主启动类 <code>cn.com.GogoApplication</code> 启动项目</p>
<h3 id="前端服务">前端服务</h3>
<p>1、克隆代码</p>
<pre><code class="language-bash">git clone -b master-fetchhttps://gitee.com/dromara/go-view.git
</code></pre>
<ul>
<li>纯前端分支：<code>master</code></li>
<li>携带后端请求分支：<code>master-fetch</code></li>
</ul>
<p>2、进入项目目录并安装依赖</p>
<pre><code class="language-bash">cd go-view
# 推荐使用 pnpm
pnpm install
</code></pre>
<p>3、修改配置文件 <code>.env</code> 中的后端请求地址为本地地址</p>
<pre><code class="language-bash"># port
VITE_DEV_PORT = '8080'
# development path
# VITE_DEV_PATH = 'https://demo.mtruning.club'
VITE_DEV_PATH = 'http://localhost:8083'
</code></pre>
<p>4、启动服务</p>
<pre><code class="language-bash">pnpm run dev
</code></pre>
<p>5、启动成功后，浏览器访问</p>
<pre><code class="language-bash">http://localhost:3000/#/
</code></pre>
<blockquote>
<p>默认的用户名、密码：<code>admin</code>/<code>admin</code>.</p>
</blockquote>
<p>6、打包部署</p>
<pre><code class="language-bash">pnpm run build
</code></pre>
<p><code>go-view</code> 用低代码的模式降低了数据大屏可视化开发的门槛，通过拖拉拽的方式，让非技术人员实现 DIY 数据看板，十分容易上手！快去安装试试吧~</p>
<pre><code>项目地址：https://gitee.com/dromara/go-view
</code></pre>
<h2 id="最后">最后</h2>
<p>推荐的开源项目已经收录到 <code>GitHub</code> 项目，欢迎 <code>Star</code>：</p>
<pre><code>https://github.com/chenyl8848/great-open-source-project
</code></pre>
<p>或者访问网站，进行在线浏览：</p>
<pre><code>https://chencoding.top:8090/#/
</code></pre>
<p><img src="https://create-center.oss-cn-shenzhen.aliyuncs.com/github/img-20250608222400.png"></p>
<p><strong>我创建了一个开源项目交流群，方便大家在群里交流、讨论开源项目</strong>。</p>
<p><strong>但是任何人在群里打任何广告，都会被 T 掉</strong>。</p>
<p><strong>如果你对这个交流群感兴趣或者在使用开源项目中遇到问题，可以通过如下方式进群</strong>：</p>
<p><strong>关注微信公众号：【Java陈序员】，回复【开源项目交流群】进群，或者通过公众号下方的菜单添加个人微信，并备注【开源项目交流群】，通过后拉你进群</strong>。</p>
<blockquote>
<p>大家的点赞、收藏和评论都是对作者的支持，如文章对你有帮助还请点赞转发支持下，谢谢！</p>
</blockquote>
<hr><br><br>
来源：https://www.cnblogs.com/codechen8848/p/18953709
頁:
[1]