• 轻量级SQLite可视化工具Sqliteviz


    在这里插入图片描述

    什么是 Sqliteviz ?

    Sqliteviz 是一个单页面离线优先的渐进式网络应用(PWA),用于完全客户端SQLite 数据库CSV 文件的可视化。

    所谓完全客户端,就是您的数据库永远不会离开您的计算机。使用 sqliteviz,您可以:

    • SQLite 数据库运行 SQL 查询,并基于结果集创建 Plotly 图表和数据透视表 ;
    • CSV 文件导入 SQLite 数据库,并可视化导入的数据;
    • 将结果集导出为 CSV 文件;
    • 管理查询并对不同的数据库运行它们;
    • 从/到 JSON 文件导入/导出查询;
    • 导出修改后的 SQLite 数据库;
    • 您可以在离线状态下从操作系统应用菜单中使用它,就像使用任何其他桌面应用程序一样;

    Sqliteviz 功能演示

    构建镜像

    如果你不想自己构建,可以跳过,直接阅读下一章节

    官方提供了本地测试的 Dockerfile,但其使用的基础镜像比较老,也未使用分层构建,所以老苏做了些许调整👇

    # An easy way to run tests locally without Nodejs installed:      
    #      
    #     docker build -t sqliteviz/test -f Dockerfile.test .      
    #      
          
    FROM node:16.16 as build-base   
        
    RUN set -ex; \    
        apt update; \    
        apt install -y chromium firefox-esr; \    
        npm install -g npm@7    
        
    WORKDIR /tmp/build    
        
    COPY package.json package-lock.json ./    
    COPY lib lib      
    RUN npm install      
        
    COPY . .    
        
    RUN set -ex; \    
        sed -i 's/browsers: \[.*\],/browsers: ['"'FirefoxHeadlessTouch'"'],/' karma.conf.js    
        
    #RUN npm run lint -- --no-fix && npm run test  
    RUN npx browserslist@latest --update-db && \  
        npm run build  
      
    FROM nginx:1.12-alpine  
    COPY --from=build-base /tmp/build/dist /usr/share/nginx/html  
      
    EXPOSE 80  
      
    CMD ["nginx", "-g", "daemon off;"]
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33

    构建镜像和容器运行的基本命令如下👇

    # 下载代码
    git clone https://github.com/lana-k/sqliteviz.git
    
    # 进入目录  
    cd sqliteviz
    
    # 构建镜像
    docker build -t wbsu2003/sqliteviz:v1 -f Dockerfile.test .
    
    # 运行容器
    docker run -d \
       --name sqliteviz \
       -p 3366:80 \
       wbsu2003/sqliteviz:v1
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14

    安装

    在群晖上以 Docker 方式安装。

    在注册表中搜索 sqliteviz ,选择第一个 wbsu2003/sqliteviz,版本选择 latest

    端口

    本地端口不冲突就行,不确定的话可以用命令查一下

    # 查看端口占用
    netstat -tunlp | grep 端口号
    
    • 1
    • 2
    本地端口容器端口
    336680

    命令行安装

    如果你熟悉命令行,可能用 docker cli 更快捷

    # 运行容器
    docker run -d \
       --name sqliteviz \
       -p 3366:80 \
       wbsu2003/sqliteviz
    
    • 1
    • 2
    • 3
    • 4
    • 5

    也可以用 docker-compose 安装,将下面的内容保存为 docker-compose.yml 文件

    version: '3'
    
    services:
      sqliteviz:
        image: wbsu2003/sqliteviz
        container_name: sqliteviz
        restart: unless-stopped
        ports:
          - 3366:80
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9

    然后执行下面的命令

    # 新建文件夹 sqliteviz
    mkdir -p /volume1/docker/sqliteviz
    
    # 进入 sqliteviz 目录
    cd /volume1/docker/sqliteviz
    
    # 将 docker-compose.yml 放入当前目录
    
    # 一键启动
    docker-compose up -d
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10

    运行

    在浏览器中输入 http://群晖IP:3366 就能看到主界面

    • ①可以上传或者拖入一个已有的数据库文件;
    • ②可以创建一个空的数据库;

    老苏用来测试的还是 homebox 的数据库

    点右上角的 Create 按钮创建查询,输入 SQL 语句会有提示

    运行 SQL 查询

    详细的使用方法,请参考官方文档:https://sqliteviz.com/docs/basic-usage

    参考文档

    lana-k/sqliteviz: Instant offline SQL-powered data visualisation in your browser
    地址:https://github.com/lana-k/sqliteviz

    Home - sqliteviz
    地址:https://sqliteviz.com/

    Introduction - sqliteviz
    地址:https://sqliteviz.com/docs/

  • 相关阅读:
    vue3源码分析——手写diff算法
    夭寿啦!我的网站被攻击了了735200次还没崩
    如何实现图片预加载和加载进度条
    LeetCode C++ 67.二进制求和
    SpringBoot + LiteFlow:轻松应对复杂业务逻辑,简直不要太香!
    日期模拟器(改变check即可 手切日期)
    【JAVASE】java开发人员最常犯的10中错误
    信息学奥赛一本通 1852:【08NOIP提高组】火柴棒等式 | 洛谷 P1149 [NOIP2008 提高组] 火柴棒等式
    微服务(十五)——Sentinel 高可用流量管理框架
    python+Django 使用apscheduler实现定时任务 管理调度
  • 原文地址:https://blog.csdn.net/wbsu2004/article/details/137989122