fm453/smartchart
1
0
Fork 0
mirror of https://gitee.com/smartchart/smartchart synced 2025-05-05 09:09:24 +08:00
Code Issues Packages Projects Releases Wiki Activity
smartchart/docs/docs/1.基础操作/快速开始/index.html
JohnYan 3fb43dcca0 v6.4
2023-04-06 16:59:28 +08:00

2266 lines
54 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="开发前视屏 # 6.0介绍视屏 4.0操作视屏教程 5.0变更操作视屏教程 开发系列合集,关注作者持续更新 由于版本的变更, 一些图标可能会有一些变化, 但位置无太大的变化
安装Python环境 # 环境准备: 官方 最新Python下载链接,可以到 淘宝镜象下载,也可以下载 WINDOWS64位安装版, MAC电脑安装版 Window平台安装视屏介绍,注意: Windows安装Python时需选中&quot;Add to Path&quot; Linux安装可参考文档下方的部署说明, Linux安装说明 安装SmartChart # 在Shell或CMD命令行执行
pip3 install smartchart 如果安装过程慢,建意使用 pip3 install -i https://pypi.tuna.tsinghua.edu.cn/simple smartchart -U 升级方法: pip3 install smartchart -U 启动smartchart # 本地命令行启动: smartchart 如果你是服务器部署,远程访问,服务端启动方式: smartchart runserver 0.0.0.0:8000 --insecure --noreload 如果出现套接字，端口被占用， 可修改端口号启动， 如 smartchart runserver 0.0.0.0:8001 --insecure --noreload 一般本地启动后访问： http://127.0.0.1:8000 管理员帐号密码: admin/admin, 请及时更改密码
如果忘记密码, 可以使用此命令重置 smartchart changepassword 用户名 查看demo # 尝试熟悉编辑菜单 尝试点开数据集查看SQL写法， 图形编辑器， 容器等 仪表盘菜单 # 功能项 子项 使用说明 菜单栏 - 点击可展开隐藏, 可移动位置 设定 常规设定 权限管理,水印,模板应用,版本控制.">
<meta name="theme-color" content="#FFFFFF">
<meta name="color-scheme" content="light dark"><meta property="og:title" content="快速开始" />
<meta property="og:description" content="开发前视屏 # 6.0介绍视屏 4.0操作视屏教程 5.0变更操作视屏教程 开发系列合集,关注作者持续更新 由于版本的变更, 一些图标可能会有一些变化, 但位置无太大的变化
安装Python环境 # 环境准备: 官方 最新Python下载链接,可以到 淘宝镜象下载,也可以下载 WINDOWS64位安装版, MAC电脑安装版 Window平台安装视屏介绍,注意: Windows安装Python时需选中&quot;Add to Path&quot; Linux安装可参考文档下方的部署说明, Linux安装说明 安装SmartChart # 在Shell或CMD命令行执行
pip3 install smartchart 如果安装过程慢,建意使用 pip3 install -i https://pypi.tuna.tsinghua.edu.cn/simple smartchart -U 升级方法: pip3 install smartchart -U 启动smartchart # 本地命令行启动: smartchart 如果你是服务器部署,远程访问,服务端启动方式: smartchart runserver 0.0.0.0:8000 --insecure --noreload 如果出现套接字，端口被占用， 可修改端口号启动， 如 smartchart runserver 0.0.0.0:8001 --insecure --noreload 一般本地启动后访问： http://127.0.0.1:8000 管理员帐号密码: admin/admin, 请及时更改密码
如果忘记密码, 可以使用此命令重置 smartchart changepassword 用户名 查看demo # 尝试熟悉编辑菜单 尝试点开数据集查看SQL写法， 图形编辑器， 容器等 仪表盘菜单 # 功能项 子项 使用说明 菜单栏 - 点击可展开隐藏, 可移动位置 设定 常规设定 权限管理,水印,模板应用,版本控制." />
<meta property="og:type" content="article" />
<meta property="og:url" content="https://help.smartchart.cn/docs/1.%E5%9F%BA%E7%A1%80%E6%93%8D%E4%BD%9C/%E5%BF%AB%E9%80%9F%E5%BC%80%E5%A7%8B/" /><meta property="article:section" content="docs" />
<title>快速开始 | Smartchart开发手册</title>
<link rel="manifest" href="/manifest.json">
<link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.c58292d36b18b675680ab9baea2029204537b839ea72f258746ec0f32ce8d6c8.css" integrity="sha256-xYKS02sYtnVoCrm66iApIEU3uDnqcvJYdG7A8yzo1sg=" crossorigin="anonymous">
<script defer src="/flexsearch.min.js"></script>
<script defer src="/en.search.min.91c705dd5fec520547517ab2995e9a01fb5099a75bf7d8c3845c48e8e87af5eb.js" integrity="sha256-kccF3V/sUgVHUXqymV6aAftQmadb99jDhFxI6Oh69es=" crossorigin="anonymous"></script>
<script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
<!--
Made with Book Theme
https://github.com/alex-shpak/hugo-book
-->
</head>
<body dir="ltr">
<input type="checkbox" class="hidden toggle" id="menu-control" />
<input type="checkbox" class="hidden toggle" id="toc-control" />
<main class="container flex">
<aside class="book-menu">
<div class="book-menu-content">
<nav>
<h2 class="book-brand">
<a class="flex align-center" href="/"><span>Smartchart开发手册</span>
</a>
</h2>
<div class="book-search">
<input type="text" id="book-search-input" placeholder="Search" aria-label="Search" maxlength="64" data-hotkeys="s/" />
<div class="book-search-spinner hidden"></div>
<ul id="book-search-results"></ul>
</div>
<ul>
<li>
<a href="/docs/%E5%85%B3%E4%BA%8E%E6%88%91%E4%BB%AC/" class="">关于我们</a>
</li>
<li>
<a href="/docs/%E8%AE%BE%E8%AE%A1%E7%90%86%E5%BF%B5/" class="">设计理念</a>
</li>
<li>
<input type="checkbox" id="section-c354321856ed6feb84c1b4323285de46" class="toggle" checked />
<label for="section-c354321856ed6feb84c1b4323285de46" class="flex justify-between">
<a role="button" class="">1.基础操作</a>
</label>
<ul>
<li>
<a href="/docs/1.%E5%9F%BA%E7%A1%80%E6%93%8D%E4%BD%9C/%E4%B8%93%E4%B8%9A%E7%89%88%E8%AF%B4%E6%98%8E/" class="">专业版本说明</a>
</li>
<li>
<a href="/docs/1.%E5%9F%BA%E7%A1%80%E6%93%8D%E4%BD%9C/%E5%BF%AB%E9%80%9F%E5%BC%80%E5%A7%8B/" class="active">快速开始</a>
</li>
<li>
<a href="/docs/1.%E5%9F%BA%E7%A1%80%E6%93%8D%E4%BD%9C/%E7%AC%AC%E4%B8%80%E4%B8%AA%E4%BB%AA%E8%A1%A8%E7%9B%98/" class="">第一个仪表盘</a>
</li>
<li>
<a href="/docs/1.%E5%9F%BA%E7%A1%80%E6%93%8D%E4%BD%9C/%E7%AC%AC%E4%B8%80%E4%B8%AA%E5%A4%8D%E6%9D%82%E6%8A%A5%E8%A1%A8/" class="">第一个复杂报表</a>
</li>
<li>
<a href="/docs/1.%E5%9F%BA%E7%A1%80%E6%93%8D%E4%BD%9C/%E7%AC%AC%E4%B8%80%E4%B8%AA3D%E5%9C%BA%E6%99%AF/" class="">第一个3D场景</a>
</li>
<li>
<a href="/docs/1.%E5%9F%BA%E7%A1%80%E6%93%8D%E4%BD%9C/%E7%AC%AC%E4%B8%80%E4%B8%AA%E4%B8%8A%E7%BA%BF%E6%95%B0%E6%8D%AE%E9%9B%86/" class="">第一个上线数据集</a>
</li>
<li>
<a href="/docs/1.%E5%9F%BA%E7%A1%80%E6%93%8D%E4%BD%9C/%E5%88%9B%E5%BB%BA%E8%BF%9E%E6%8E%A5%E6%B1%A0/" class="">创建连接池</a>
</li>
<li>
<a href="/docs/1.%E5%9F%BA%E7%A1%80%E6%93%8D%E4%BD%9C/%E5%BA%94%E7%94%A8%E6%A8%A1%E6%9D%BF/" class="">应用模板</a>
</li>
<li>
<a href="/docs/1.%E5%9F%BA%E7%A1%80%E6%93%8D%E4%BD%9C/%E6%9D%83%E9%99%90%E7%AE%A1%E7%90%86/" class="">权限管理</a>
</li>
<li>
<input type="checkbox" id="section-ebbdf386fef5a4b61debc89d61d0dadf" class="toggle" />
<label for="section-ebbdf386fef5a4b61debc89d61d0dadf" class="flex justify-between">
<a role="button" class="">Vue相关</a>
</label>
<ul>
<li>
<a href="/docs/1.%E5%9F%BA%E7%A1%80%E6%93%8D%E4%BD%9C/VUE%E7%9B%B8%E5%85%B3/%E4%BD%BF%E7%94%A8VUE/" class="">使用 Vue</a>
</li>
<li>
<a href="/docs/1.%E5%9F%BA%E7%A1%80%E6%93%8D%E4%BD%9C/VUE%E7%9B%B8%E5%85%B3/ElementUI/" class="">Element Ui</a>
</li>
<li>
<a href="/docs/1.%E5%9F%BA%E7%A1%80%E6%93%8D%E4%BD%9C/VUE%E7%9B%B8%E5%85%B3/DataV%E5%BA%94%E7%94%A8/" class="">Data V应用</a>
</li>
</ul>
</li>
<li>
<input type="checkbox" id="section-5bb75c87734dfbe4db2b79fa99d34f85" class="toggle" />
<label for="section-5bb75c87734dfbe4db2b79fa99d34f85" class="flex justify-between">
<a role="button" class="">不太重要</a>
</label>
<ul>
<li>
<a href="/docs/1.%E5%9F%BA%E7%A1%80%E6%93%8D%E4%BD%9C/%E4%B8%8D%E5%A4%AA%E9%87%8D%E8%A6%81/%E4%B8%BB%E9%A2%98%E5%BA%94%E7%94%A8PRO/" class="">主题应用 Pro</a>
</li>
<li>
<a href="/docs/1.%E5%9F%BA%E7%A1%80%E6%93%8D%E4%BD%9C/%E4%B8%8D%E5%A4%AA%E9%87%8D%E8%A6%81/%E5%A4%8D%E5%88%B6%E4%BB%AA%E8%A1%A8%E7%9B%98/" class="">复制仪表盘</a>
</li>
</ul>
</li>
</ul>
</li>
<li>
<input type="checkbox" id="section-54fee82a365f217fe67a17292f7959e5" class="toggle" />
<label for="section-54fee82a365f217fe67a17292f7959e5" class="flex justify-between">
<a role="button" class="">2.数据集说明</a>
</label>
<ul>
<li>
<a href="/docs/2.%E6%95%B0%E6%8D%AE%E9%9B%86%E8%AF%B4%E6%98%8E/%E6%95%B0%E6%8D%AE%E9%9B%86%E5%BC%80%E5%8F%91%E7%95%8C%E9%9D%A2/" class="">数据集开发界面</a>
</li>
<li>
<a href="/docs/2.%E6%95%B0%E6%8D%AE%E9%9B%86%E8%AF%B4%E6%98%8E/SQL%E6%95%B0%E6%8D%AE%E9%9B%86/" class="">Sql数据集</a>
</li>
<li>
<a href="/docs/2.%E6%95%B0%E6%8D%AE%E9%9B%86%E8%AF%B4%E6%98%8E/%E6%95%B0%E6%8D%AE%E9%9B%86%E6%95%B0%E6%8D%AE%E5%88%B7%E6%96%B0/" class="">数据集数据刷新</a>
</li>
<li>
<input type="checkbox" id="section-17dce050c02e560c36fb8bcb52fc8432" class="toggle" />
<label for="section-17dce050c02e560c36fb8bcb52fc8432" class="flex justify-between">
<a role="button" class="">特殊数据源</a>
</label>
<ul>
<li>
<a href="/docs/2.%E6%95%B0%E6%8D%AE%E9%9B%86%E8%AF%B4%E6%98%8E/%E7%89%B9%E6%AE%8A%E6%95%B0%E6%8D%AE%E6%BA%90/API%E6%95%B0%E6%8D%AE%E9%9B%86/" class="">Api数据集</a>
</li>
<li>
<a href="/docs/2.%E6%95%B0%E6%8D%AE%E9%9B%86%E8%AF%B4%E6%98%8E/%E7%89%B9%E6%AE%8A%E6%95%B0%E6%8D%AE%E6%BA%90/%E4%BD%BF%E7%94%A8EXCEL%E6%95%B0%E6%8D%AE/" class="">使用 Excel数据</a>
</li>
<li>
<a href="/docs/2.%E6%95%B0%E6%8D%AE%E9%9B%86%E8%AF%B4%E6%98%8E/%E7%89%B9%E6%AE%8A%E6%95%B0%E6%8D%AE%E6%BA%90/Python%E6%95%B0%E6%8D%AE%E9%9B%86/" class="">Python数据集</a>
</li>
<li>
<a href="/docs/2.%E6%95%B0%E6%8D%AE%E9%9B%86%E8%AF%B4%E6%98%8E/%E7%89%B9%E6%AE%8A%E6%95%B0%E6%8D%AE%E6%BA%90/%E8%87%AA%E5%AE%9A%E4%B9%89%E6%95%B0%E6%8D%AE%E6%BA%90/" class="">自定义数据源</a>
</li>
<li>
<a href="/docs/2.%E6%95%B0%E6%8D%AE%E9%9B%86%E8%AF%B4%E6%98%8E/%E7%89%B9%E6%AE%8A%E6%95%B0%E6%8D%AE%E6%BA%90/webSocket%E6%96%B9%E5%BC%8F/" class="">Web Socket方式</a>
</li>
<li>
<a href="/docs/2.%E6%95%B0%E6%8D%AE%E9%9B%86%E8%AF%B4%E6%98%8E/%E7%89%B9%E6%AE%8A%E6%95%B0%E6%8D%AE%E6%BA%90/Elasticsearch%E6%95%B0%E6%8D%AE%E6%BA%90/" class="">Elasticsearch数据源</a>
</li>
<li>
<a href="/docs/2.%E6%95%B0%E6%8D%AE%E9%9B%86%E8%AF%B4%E6%98%8E/%E7%89%B9%E6%AE%8A%E6%95%B0%E6%8D%AE%E6%BA%90/JDBC%E6%95%B0%E6%8D%AE%E6%BA%90/" class="">Jdbc数据源</a>
</li>
<li>
<a href="/docs/2.%E6%95%B0%E6%8D%AE%E9%9B%86%E8%AF%B4%E6%98%8E/%E7%89%B9%E6%AE%8A%E6%95%B0%E6%8D%AE%E6%BA%90/kafka%E6%95%B0%E6%8D%AE%E6%BA%90/" class="">Kafka数据源</a>
</li>
<li>
<a href="/docs/2.%E6%95%B0%E6%8D%AE%E9%9B%86%E8%AF%B4%E6%98%8E/%E7%89%B9%E6%AE%8A%E6%95%B0%E6%8D%AE%E6%BA%90/mongodb%E6%95%B0%E6%8D%AE%E6%BA%90/" class="">Mongodb数据源</a>
</li>
<li>
<a href="/docs/2.%E6%95%B0%E6%8D%AE%E9%9B%86%E8%AF%B4%E6%98%8E/%E7%89%B9%E6%AE%8A%E6%95%B0%E6%8D%AE%E6%BA%90/promitheus%E6%95%B0%E6%8D%AE%E6%BA%90/" class="">Promitheus数据源</a>
</li>
<li>
<a href="/docs/2.%E6%95%B0%E6%8D%AE%E9%9B%86%E8%AF%B4%E6%98%8E/%E7%89%B9%E6%AE%8A%E6%95%B0%E6%8D%AE%E6%BA%90/Redis%E6%95%B0%E6%8D%AE%E6%BA%90/" class="">Redis数据源</a>
</li>
<li>
<a href="/docs/2.%E6%95%B0%E6%8D%AE%E9%9B%86%E8%AF%B4%E6%98%8E/%E7%89%B9%E6%AE%8A%E6%95%B0%E6%8D%AE%E6%BA%90/sqlalchemy%E8%BF%9E%E6%8E%A5/" class="">Sqlalchemy连接</a>
</li>
<li>
<a href="/docs/2.%E6%95%B0%E6%8D%AE%E9%9B%86%E8%AF%B4%E6%98%8E/%E7%89%B9%E6%AE%8A%E6%95%B0%E6%8D%AE%E6%BA%90/%E9%82%AE%E4%BB%B6%E5%8F%91%E9%80%81%E6%95%B0%E6%8D%AE%E6%BA%90/" class="">邮件发送数据源</a>
</li>
</ul>
</li>
<li>
<input type="checkbox" id="section-b696a5333fb0b6aa0ada2335e5fe864c" class="toggle" />
<label for="section-b696a5333fb0b6aa0ada2335e5fe864c" class="flex justify-between">
<a role="button" class="">数据集形态</a>
</label>
<ul>
<li>
<a href="/docs/2.%E6%95%B0%E6%8D%AE%E9%9B%86%E8%AF%B4%E6%98%8E/%E6%95%B0%E6%8D%AE%E9%9B%86%E5%BD%A2%E6%80%81/%E5%85%B1%E4%BA%AB%E6%95%B0%E6%8D%AE%E9%9B%86/" class="">共享数据集</a>
</li>
<li>
<a href="/docs/2.%E6%95%B0%E6%8D%AE%E9%9B%86%E8%AF%B4%E6%98%8E/%E6%95%B0%E6%8D%AE%E9%9B%86%E5%BD%A2%E6%80%81/%E6%95%B0%E6%8D%AE%E9%9B%86%E6%87%92%E5%8A%A0%E8%BD%BD/" class="">数据集懒加载</a>
</li>
</ul>
</li>
</ul>
</li>
<li>
<input type="checkbox" id="section-c5a4ac1635ece2dfef28e23678ea9e21" class="toggle" />
<label for="section-c5a4ac1635ece2dfef28e23678ea9e21" class="flex justify-between">
<a role="button" class="">3.图形开发</a>
</label>
<ul>
<li>
<a href="/docs/3.%E5%9B%BE%E5%BD%A2%E5%BC%80%E5%8F%91/%E5%9F%BA%E7%A1%80%E5%9B%BE%E5%BD%A2/" class="">基础图形</a>
</li>
<li>
<a href="/docs/3.%E5%9B%BE%E5%BD%A2%E5%BC%80%E5%8F%91/%E7%AE%A1%E7%90%86%E5%9B%BE%E5%BD%A2/" class="">管理图形</a>
</li>
<li>
<a href="/docs/3.%E5%9B%BE%E5%BD%A2%E5%BC%80%E5%8F%91/Echarts%E7%BB%84%E4%BB%B6/" class="">Echarts组件</a>
</li>
<li>
<a href="/docs/3.%E5%9B%BE%E5%BD%A2%E5%BC%80%E5%8F%91/HTML%E7%BB%84%E4%BB%B6/" class="">Html组件</a>
</li>
<li>
<a href="/docs/3.%E5%9B%BE%E5%BD%A2%E5%BC%80%E5%8F%91/%E8%B0%83%E8%AF%95%E6%97%A5%E5%BF%97/" class="">调试日志</a>
</li>
<li>
<input type="checkbox" id="section-8b7ef748294c9611ad2ef758768793c4" class="toggle" />
<label for="section-8b7ef748294c9611ad2ef758768793c4" class="flex justify-between">
<a role="button" class="">函数方法</a>
</label>
<ul>
<li>
<a href="/docs/3.%E5%9B%BE%E5%BD%A2%E5%BC%80%E5%8F%91/%E5%87%BD%E6%95%B0%E6%96%B9%E6%B3%95/%E5%9B%BE%E5%BD%A2%E7%AB%AF%E6%95%B0%E6%8D%AE%E5%87%BD%E6%95%B0/" class="">图形端数据函数</a>
</li>
<li>
<a href="/docs/3.%E5%9B%BE%E5%BD%A2%E5%BC%80%E5%8F%91/%E5%87%BD%E6%95%B0%E6%96%B9%E6%B3%95/Jquery%E9%81%8D%E5%8E%86%E6%96%B9%E6%B3%95/" class="">Jquery遍历方法</a>
</li>
</ul>
</li>
<li>
<input type="checkbox" id="section-4e8eda9dcb8eb0bfa033731d4401df15" class="toggle" />
<label for="section-4e8eda9dcb8eb0bfa033731d4401df15" class="flex justify-between">
<a role="button" class="">特殊图形</a>
</label>
<ul>
<li>
<a href="/docs/3.%E5%9B%BE%E5%BD%A2%E5%BC%80%E5%8F%91/%E7%89%B9%E6%AE%8A%E5%9B%BE%E5%BD%A2/LineUp%E5%9B%BE%E5%BD%A2/" class="">Line Up图形</a>
</li>
<li>
<a href="/docs/3.%E5%9B%BE%E5%BD%A2%E5%BC%80%E5%8F%91/%E7%89%B9%E6%AE%8A%E5%9B%BE%E5%BD%A2/%E4%BD%BF%E7%94%A8%E5%9B%BE%E6%A0%87/" class="">使用图标</a>
</li>
<li>
<a href="/docs/3.%E5%9B%BE%E5%BD%A2%E5%BC%80%E5%8F%91/%E7%89%B9%E6%AE%8A%E5%9B%BE%E5%BD%A2/%E6%97%A0%E7%BC%9D%E6%BB%9A%E5%8A%A8/" class="">无缝滚动</a>
</li>
<li>
<a href="/docs/3.%E5%9B%BE%E5%BD%A2%E5%BC%80%E5%8F%91/%E7%89%B9%E6%AE%8A%E5%9B%BE%E5%BD%A2/%E7%89%B9%E6%AE%8A%E5%9B%BE%E5%BD%A2%E5%8A%A0%E8%BD%BD/" class="">特殊图形加载</a>
</li>
</ul>
</li>
<li>
<input type="checkbox" id="section-30aee618b2f055fbebe03b9acabc9330" class="toggle" />
<label for="section-30aee618b2f055fbebe03b9acabc9330" class="flex justify-between">
<a role="button" class="">Element Ui组件</a>
</label>
<ul>
<li>
<a href="/docs/3.%E5%9B%BE%E5%BD%A2%E5%BC%80%E5%8F%91/ElementUI%E7%BB%84%E4%BB%B6/%E5%B8%A6%E5%88%86%E9%A1%B5%E7%9A%84%E8%A1%A8%E6%A0%BC/" class="">带分页的表格</a>
</li>
</ul>
</li>
</ul>
</li>
<li>
<input type="checkbox" id="section-478b5d3161d3129d62529b01d6fb834c" class="toggle" />
<label for="section-478b5d3161d3129d62529b01d6fb834c" class="flex justify-between">
<a role="button" class="">4.布局说明</a>
</label>
<ul>
<li>
<a href="/docs/4.%E5%B8%83%E5%B1%80%E8%AF%B4%E6%98%8E/%E5%B8%83%E5%B1%80%E6%8C%87%E5%BC%95/" class="">布局指引</a>
</li>
<li>
<a href="/docs/4.%E5%B8%83%E5%B1%80%E8%AF%B4%E6%98%8E/%E6%8B%96%E6%8B%BD%E8%87%AA%E5%8A%A8%E5%AF%B9%E9%BD%90/" class="">拖拽自动对齐</a>
</li>
<li>
<a href="/docs/4.%E5%B8%83%E5%B1%80%E8%AF%B4%E6%98%8E/%E5%88%A0%E9%99%A4%E5%AE%B9%E5%99%A8/" class="">删除容器</a>
</li>
</ul>
</li>
<li>
<input type="checkbox" id="section-86bbf1d771d855758065f951675b7ee7" class="toggle" />
<label for="section-86bbf1d771d855758065f951675b7ee7" class="flex justify-between">
<a role="button" class="">5.参数及联动钻取</a>
</label>
<ul>
<li>
<a href="/docs/5.%E5%8F%82%E6%95%B0%E5%8F%8A%E8%81%94%E5%8A%A8%E9%92%BB%E5%8F%96/%E5%8F%82%E6%95%B0%E7%BC%96%E5%86%99%E6%96%B9%E6%B3%95/" class="">参数编写方法</a>
</li>
<li>
<a href="/docs/5.%E5%8F%82%E6%95%B0%E5%8F%8A%E8%81%94%E5%8A%A8%E9%92%BB%E5%8F%96/%E5%9B%BE%E5%BD%A2%E8%81%94%E5%8A%A8%E9%92%BB%E5%8F%96/" class="">图形联动钻取</a>
</li>
<li>
<a href="/docs/5.%E5%8F%82%E6%95%B0%E5%8F%8A%E8%81%94%E5%8A%A8%E9%92%BB%E5%8F%96/%E7%AD%9B%E9%80%89%E5%99%A8%E6%8C%87%E5%8D%97/" class="">筛选器指南</a>
</li>
<li>
<a href="/docs/5.%E5%8F%82%E6%95%B0%E5%8F%8A%E8%81%94%E5%8A%A8%E9%92%BB%E5%8F%96/%E7%BB%84%E4%BB%B6%E8%87%AA%E5%AE%9A%E4%B9%89%E8%81%94%E5%8A%A8/" class="">组件自定义联动</a>
</li>
</ul>
</li>
<li>
<input type="checkbox" id="section-1a4301e6dac08bd3bdb48c3500ec971d" class="toggle" />
<label for="section-1a4301e6dac08bd3bdb48c3500ec971d" class="flex justify-between">
<a role="button" class="">6.进阶开发 Pro</a>
</label>
<ul>
<li>
<input type="checkbox" id="section-3b9f1904c5bd48ec9e224dbf4f4a7d54" class="toggle" />
<label for="section-3b9f1904c5bd48ec9e224dbf4f4a7d54" class="flex justify-between">
<a role="button" class="">低代码开发</a>
</label>
<ul>
<li>
<a href="/docs/6.%E8%BF%9B%E9%98%B6%E5%BC%80%E5%8F%91PRO/%E4%BD%8E%E4%BB%A3%E7%A0%81%E5%BC%80%E5%8F%91/%E6%A8%A1%E6%9D%BF%E5%BC%80%E5%8F%91%E7%95%8C%E9%9D%A2/" class="">模板开发界面</a>
</li>
<li>
<a href="/docs/6.%E8%BF%9B%E9%98%B6%E5%BC%80%E5%8F%91PRO/%E4%BD%8E%E4%BB%A3%E7%A0%81%E5%BC%80%E5%8F%91/%E5%BF%AB%E6%8D%B7%E5%BC%80%E5%8F%91/" class="">快捷开发</a>
</li>
<li>
<a href="/docs/6.%E8%BF%9B%E9%98%B6%E5%BC%80%E5%8F%91PRO/%E4%BD%8E%E4%BB%A3%E7%A0%81%E5%BC%80%E5%8F%91/%E4%B8%8A%E4%BC%A0%E8%B5%84%E6%BA%90%E6%96%87%E4%BB%B6/" class="">上传资源文件</a>
</li>
<li>
<a href="/docs/6.%E8%BF%9B%E9%98%B6%E5%BC%80%E5%8F%91PRO/%E4%BD%8E%E4%BB%A3%E7%A0%81%E5%BC%80%E5%8F%91/%E8%BE%B9%E6%A1%86%E4%B8%8E%E8%A3%85%E9%A5%B0/" class="">边框与装饰</a>
</li>
<li>
<a href="/docs/6.%E8%BF%9B%E9%98%B6%E5%BC%80%E5%8F%91PRO/%E4%BD%8E%E4%BB%A3%E7%A0%81%E5%BC%80%E5%8F%91/%E6%A0%B7%E5%BC%8F%E5%BF%AB%E9%80%9F%E4%B8%8A%E6%89%8B/" class="">样式快速上手</a>
</li>
<li>
<a href="/docs/6.%E8%BF%9B%E9%98%B6%E5%BC%80%E5%8F%91PRO/%E4%BD%8E%E4%BB%A3%E7%A0%81%E5%BC%80%E5%8F%91/IDE%E5%BC%80%E5%8F%91%E6%A8%A1%E5%BC%8F/" class="">ID E开发模式</a>
</li>
<li>
<a href="/docs/6.%E8%BF%9B%E9%98%B6%E5%BC%80%E5%8F%91PRO/%E4%BD%8E%E4%BB%A3%E7%A0%81%E5%BC%80%E5%8F%91/%E5%8A%A8%E7%94%BB%E6%95%88%E6%9E%9C/" class="">动画效果</a>
</li>
<li>
<a href="/docs/6.%E8%BF%9B%E9%98%B6%E5%BC%80%E5%8F%91PRO/%E4%BD%8E%E4%BB%A3%E7%A0%81%E5%BC%80%E5%8F%91/%E7%BC%96%E8%BE%91%E5%99%A8%E5%BF%AB%E6%8D%B7%E9%94%AE/" class="">编辑器快捷键</a>
</li>
</ul>
</li>
<li>
<input type="checkbox" id="section-2b5b070b11b526d911f2143b53347842" class="toggle" />
<label for="section-2b5b070b11b526d911f2143b53347842" class="flex justify-between">
<a role="button" class="">数据服务</a>
</label>
<ul>
<li>
<a href="/docs/6.%E8%BF%9B%E9%98%B6%E5%BC%80%E5%8F%91PRO/%E6%95%B0%E6%8D%AE%E6%9C%8D%E5%8A%A1/%E6%95%B0%E6%8D%AE%E6%9C%8D%E5%8A%A1API/" class="">数据服务 API</a>
</li>
<li>
<a href="/docs/6.%E8%BF%9B%E9%98%B6%E5%BC%80%E5%8F%91PRO/%E6%95%B0%E6%8D%AE%E6%9C%8D%E5%8A%A1/%E6%95%B0%E6%8D%AE%E4%B8%8B%E8%BD%BD/" class="">数据下载</a>
</li>
<li>
<a href="/docs/6.%E8%BF%9B%E9%98%B6%E5%BC%80%E5%8F%91PRO/%E6%95%B0%E6%8D%AE%E6%9C%8D%E5%8A%A1/%E6%95%B0%E6%8D%AE%E5%A1%AB%E6%8A%A5/" class="">数据填报</a>
</li>
<li>
<a href="/docs/6.%E8%BF%9B%E9%98%B6%E5%BC%80%E5%8F%91PRO/%E6%95%B0%E6%8D%AE%E6%9C%8D%E5%8A%A1/%E5%90%8E%E5%8F%B0API%E5%88%B7%E6%96%B0/" class="">后台 Api刷新</a>
</li>
</ul>
</li>
<li>
<a href="/docs/6.%E8%BF%9B%E9%98%B6%E5%BC%80%E5%8F%91PRO/%E5%AE%9E%E6%88%98%E5%A4%A7%E5%B1%8F%E6%A8%A1%E6%9D%BF%E8%BD%AC%E5%8C%96/" class="">实战大屏模板转化</a>
</li>
<li>
<a href="/docs/6.%E8%BF%9B%E9%98%B6%E5%BC%80%E5%8F%91PRO/%E5%A4%87%E4%BB%BD%E6%81%A2%E5%A4%8D%E5%8F%8A%E7%89%88%E6%9C%AC/" class="">备份恢复及版本</a>
</li>
<li>
<a href="/docs/6.%E8%BF%9B%E9%98%B6%E5%BC%80%E5%8F%91PRO/%E8%87%AA%E5%AE%9A%E4%B9%89%E9%A6%96%E9%A1%B5/" class="">自定义首页</a>
</li>
<li>
<a href="/docs/6.%E8%BF%9B%E9%98%B6%E5%BC%80%E5%8F%91PRO/%E9%9B%86%E6%88%90AI%E7%94%9F%E6%88%90/" class="">集成 Ai生成</a>
</li>
</ul>
</li>
<li>
<input type="checkbox" id="section-bfe0709421fcc9cc6742d70724a0841d" class="toggle" />
<label for="section-bfe0709421fcc9cc6742d70724a0841d" class="flex justify-between">
<a role="button" class="">7.报表嵌入</a>
</label>
<ul>
<li>
<a href="/docs/7.%E6%8A%A5%E8%A1%A8%E5%B5%8C%E5%85%A5/%E7%AE%80%E5%8D%95%E5%B5%8C%E5%85%A5/" class="">简单嵌入</a>
</li>
<li>
<a href="/docs/7.%E6%8A%A5%E8%A1%A8%E5%B5%8C%E5%85%A5/%E5%8D%95%E7%82%B9%E7%99%BB%E5%BD%95/" class="">单点登录</a>
</li>
<li>
<a href="/docs/7.%E6%8A%A5%E8%A1%A8%E5%B5%8C%E5%85%A5/%E5%8D%95%E9%A1%B5%E9%9D%A2%E5%B5%8C%E5%85%A5/" class="">单页面嵌入</a>
</li>
</ul>
</li>
<li>
<input type="checkbox" id="section-50ddcd837bca405840b973f89ee4c795" class="toggle" />
<label for="section-50ddcd837bca405840b973f89ee4c795" class="flex justify-between">
<a role="button" class="">8. Django应用</a>
</label>
<ul>
<li>
<a href="/docs/8.Django%E5%BA%94%E7%94%A8/%E5%B5%8C%E5%85%A5Django-Apps/" class="">嵌入 Django Apps</a>
</li>
<li>
<a href="/docs/8.Django%E5%BA%94%E7%94%A8/FAQ/" class="">Faq</a>
</li>
</ul>
</li>
<li>
<input type="checkbox" id="section-b7c8fb0b06f0332d83d8a5dbf7287f20" class="toggle" />
<label for="section-b7c8fb0b06f0332d83d8a5dbf7287f20" class="flex justify-between">
<a role="button" class="">9. Jupyter应用</a>
</label>
<ul>
<li>
<a href="/docs/9.Jupyter%E5%BA%94%E7%94%A8/Jupyter%E4%B8%AD%E4%BD%BF%E7%94%A8%E6%8C%87%E5%BC%95/" class="">Jupyter中使用指引</a>
</li>
</ul>
</li>
<li>
<input type="checkbox" id="section-3f5ca2fcf9ff7a0e49dc6f9a1c867e71" class="toggle" />
<label for="section-3f5ca2fcf9ff7a0e49dc6f9a1c867e71" class="flex justify-between">
<a role="button" class="">10.其它</a>
</label>
<ul>
<li>
<a href="/docs/10.%E5%85%B6%E5%AE%83/FAQ/" class="">Faq</a>
</li>
<li>
<a href="/docs/10.%E5%85%B6%E5%AE%83/%E8%AF%95%E7%94%A8%E6%BF%80%E6%B4%BB%E8%AF%B4%E6%98%8E/" class="">试用激活说明</a>
</li>
</ul>
</li>
<li>
<input type="checkbox" id="section-1221ac066d992a43b363728eac9711d8" class="toggle" />
<label for="section-1221ac066d992a43b363728eac9711d8" class="flex justify-between">
<a role="button" class="">11.部署指南</a>
</label>
<ul>
<li>
<input type="checkbox" id="section-df28c15db9b442124658f06e614fc60b" class="toggle" />
<label for="section-df28c15db9b442124658f06e614fc60b" class="flex justify-between">
<a role="button" class="">Linux</a>
</label>
<ul>
<li>
<a href="/docs/11.%E9%83%A8%E7%BD%B2%E6%8C%87%E5%8D%97/Linux/%E5%BF%AB%E9%80%9F%E5%BC%80%E5%A7%8B/" class="">快速开始</a>
</li>
<li>
<a href="/docs/11.%E9%83%A8%E7%BD%B2%E6%8C%87%E5%8D%97/Linux/SQLite3%E7%89%88%E6%9C%AC%E9%94%99%E8%AF%AF/" class="">Sqlite3版本错误</a>
</li>
<li>
<a href="/docs/11.%E9%83%A8%E7%BD%B2%E6%8C%87%E5%8D%97/Linux/%E7%94%9F%E4%BA%A7%E9%83%A8%E7%BD%B2/" class="">生产部署</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
<ul>
<li>
<a href="https://www.smartchart.cn/" target="_blank" rel="noopener">
官网
</a>
</li>
<li>
<a href="https://gitee.com/smartchart/smartchart" target="_blank" rel="noopener">
Gitee
</a>
</li>
</ul>
</nav>
<script>(function(){var e=document.querySelector("aside .book-menu-content");addEventListener("beforeunload",function(){localStorage.setItem("menu.scrollTop",e.scrollTop)}),e.scrollTop=localStorage.getItem("menu.scrollTop")})()</script>
</div>
</aside>
<div class="book-page">
<header class="book-header">
<div class="flex align-center justify-between">
<label for="menu-control">
<img src="/svg/menu.svg" class="book-icon" alt="Menu" />
</label>
<strong>快速开始</strong>
<label for="toc-control">
<img src="/svg/toc.svg" class="book-icon" alt="Table of Contents" />
</label>
</div>
<aside class="hidden clearfix">
<nav id="TableOfContents">
<ul>
<li>
<ul>
<li>
<ul>
<li><a href="#开发前视屏">开发前视屏</a></li>
<li><a href="#安装python环境">安装Python环境</a></li>
<li><a href="#安装smartchart">安装SmartChart</a></li>
<li><a href="#启动smartchart">启动smartchart</a></li>
<li><a href="#查看demo">查看demo</a></li>
<li><a href="#仪表盘菜单">仪表盘菜单</a></li>
<li><a href="#仪表盘容器菜单">仪表盘容器菜单</a></li>
<li><a href="#高级设定">高级设定</a></li>
<li><a href="#数据集开发">数据集开发</a></li>
<li><a href="#图形开发">图形开发</a></li>
<li><a href="#模板开发">模板开发</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</nav>
</aside>
</header>
<article class="markdown"><h3 id="开发前视屏">
开发前视屏
<a class="anchor" href="#%e5%bc%80%e5%8f%91%e5%89%8d%e8%a7%86%e5%b1%8f">#</a>
</h3>
<ul>
<li>
<a href="https://www.bilibili.com/video/BV1Md4y1h7iq">6.0介绍视屏</a></li>
<li>
<a href="https://www.bilibili.com/video/BV14u411S7L8/">4.0操作视屏教程</a></li>
<li>
<a href="https://www.bilibili.com/video/BV1fm4y1Q7DG/">5.0变更操作视屏教程</a></li>
<li>
<a href="https://space.bilibili.com/604568670/channel/series/">开发系列合集,关注作者持续更新</a></li>
</ul>
<p><strong>由于版本的变更, 一些图标可能会有一些变化, 但位置无太大的变化</strong></p>
<h3 id="安装python环境">
安装Python环境
<a class="anchor" href="#%e5%ae%89%e8%a3%85python%e7%8e%af%e5%a2%83">#</a>
</h3>
<ul>
<li>环境准备: 官方
<a href="https://www.python.org/downloads/release/python-390/" title="最新Python下载链接">最新Python下载链接</a>,可以到
<a href="https://npm.taobao.org/mirrors/python/3.9.0/" title="淘宝镜象下载">淘宝镜象下载</a>,也可以下载
<a href="https://npm.taobao.org/mirrors/python/3.9.0/python-3.9.0-amd64.exe" title="WINDOWS64位安装版">WINDOWS64位安装版</a>,
<a href="http://npm.taobao.org/mirrors/python/3.9.0/python-3.9.0rc2-macosx10.9.pkg" title="MAC电脑安装版">MAC电脑安装版</a></li>
<li>
<a href="https://www.ixigua.com/6910413586208653837?id=6901867671193649668" title="Window平台安装视屏介绍">Window平台安装视屏介绍</a>,<strong>注意: Windows安装Python时需选中&quot;Add to Path&quot;</strong></li>
<li>Linux安装可参考文档下方的部署说明,
<a href="/docs/11.%E9%83%A8%E7%BD%B2%E6%8C%87%E5%8D%97/Linux/%E5%BF%AB%E9%80%9F%E5%BC%80%E5%A7%8B/">Linux安装说明</a></li>
</ul>
<h3 id="安装smartchart">
安装SmartChart
<a class="anchor" href="#%e5%ae%89%e8%a3%85smartchart">#</a>
</h3>
<p>在Shell或CMD命令行执行</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-shell" data-lang="shell"><span style="display:flex;"><span> pip3 install smartchart
</span></span><span style="display:flex;"><span>
</span></span><span style="display:flex;"><span> 如果安装过程慢,建意使用
</span></span><span style="display:flex;"><span> pip3 install -i https://pypi.tuna.tsinghua.edu.cn/simple smartchart -U
</span></span><span style="display:flex;"><span>
</span></span><span style="display:flex;"><span> 升级方法:
</span></span><span style="display:flex;"><span> pip3 install smartchart -U
</span></span></code></pre></div><h3 id="启动smartchart">
启动smartchart
<a class="anchor" href="#%e5%90%af%e5%8a%a8smartchart">#</a>
</h3>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-shell" data-lang="shell"><span style="display:flex;"><span> 本地命令行启动:
</span></span><span style="display:flex;"><span> smartchart
</span></span><span style="display:flex;"><span> 如果你是服务器部署,远程访问,服务端启动方式:
</span></span><span style="display:flex;"><span> smartchart runserver 0.0.0.0:8000 --insecure --noreload
</span></span><span style="display:flex;"><span> 如果出现套接字，端口被占用， 可修改端口号启动， 如
</span></span><span style="display:flex;"><span> smartchart runserver 0.0.0.0:8001 --insecure --noreload
</span></span></code></pre></div><p>一般本地启动后访问： http://127.0.0.1:8000
<strong>管理员帐号密码: admin/admin, 请及时更改密码</strong></p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-shell" data-lang="shell"><span style="display:flex;"><span>如果忘记密码, 可以使用此命令重置
</span></span><span style="display:flex;"><span>smartchart changepassword 用户名
</span></span></code></pre></div><h3 id="查看demo">
查看demo
<a class="anchor" href="#%e6%9f%a5%e7%9c%8bdemo">#</a>
</h3>
<ul>
<li>尝试熟悉编辑菜单</li>
<li>尝试点开数据集查看SQL写法， 图形编辑器， 容器等</li>
</ul>
<p>
<img referrerpolicy="no-referrer" src="https://foruda.gitee.com/images/1669429149732684761/f50ac02d_5500438.png" alt="输入图片说明" title="屏幕截图"/></p>
<h3 id="仪表盘菜单">
仪表盘菜单
<a class="anchor" href="#%e4%bb%aa%e8%a1%a8%e7%9b%98%e8%8f%9c%e5%8d%95">#</a>
</h3>
<p>
<img referrerpolicy="no-referrer" src="https://foruda.gitee.com/images/1669429581637571359/b4dbbdc3_5500438.png" alt="输入图片说明" title="屏幕截图"/></p>
<table>
<thead>
<tr>
<th style="text-align:left">功能项</th>
<th style="text-align:center">子项</th>
<th style="text-align:center">使用说明</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align:left">菜单栏</td>
<td style="text-align:center">-</td>
<td style="text-align:center">点击可展开隐藏, 可移动位置</td>
</tr>
<tr>
<td style="text-align:left">设定</td>
<td style="text-align:center">常规设定</td>
<td style="text-align:center">权限管理,水印,模板应用,版本控制..</td>
</tr>
<tr>
<td style="text-align:left">设定</td>
<td style="text-align:center">高级设定</td>
<td style="text-align:center">开启模板/移动端适应/VUE/DATAV/场景背景..</td>
</tr>
<tr>
<td style="text-align:left">设定</td>
<td style="text-align:center">批量布局</td>
<td style="text-align:center">批量修改容器的HTML, 不常用</td>
</tr>
<tr>
<td style="text-align:left">设定</td>
<td style="text-align:center">容器管理</td>
<td style="text-align:center">批量查看/管理/删除容器, 不常用</td>
</tr>
<tr>
<td style="text-align:left">模板</td>
<td style="text-align:center">-</td>
<td style="text-align:center">进入低代码开发,引入JS/CSS,上传,组件&hellip;</td>
</tr>
<tr>
<td style="text-align:left">新增</td>
<td style="text-align:center">拖拽图形</td>
<td style="text-align:center">新增一个带拖拽容器的图形组件</td>
</tr>
<tr>
<td style="text-align:left">新增</td>
<td style="text-align:center">栅格图形</td>
<td style="text-align:center">新增一个带栅格容器的图形组件</td>
</tr>
<tr>
<td style="text-align:left">新增</td>
<td style="text-align:center">上线数据集</td>
<td style="text-align:center">新增一个已开发好的数据集(需要是上线状态)</td>
</tr>
<tr>
<td style="text-align:left">新增</td>
<td style="text-align:center">懒加载数据集</td>
<td style="text-align:center">新增后在菜单栏可查看编辑,此数据集需自定义触发查询,默认可引用全局变量名为data序号, 如data0</td>
</tr>
<tr>
<td style="text-align:left">新增</td>
<td style="text-align:center">通用数据集</td>
<td style="text-align:center">新增后在菜单栏可查看编辑,主动触发查询,全局变量名为data序号, 如data0</td>
</tr>
<tr>
<td style="text-align:left">新增</td>
<td style="text-align:center">静态组件</td>
<td style="text-align:center">新增一个不带数据集及图形的html组件, 如图片,文字描述&hellip;</td>
</tr>
<tr>
<td style="text-align:left">新增</td>
<td style="text-align:center">复杂报表</td>
<td style="text-align:center">使用类excel的方式开发报表</td>
</tr>
<tr>
<td style="text-align:left">拖拽开关</td>
<td style="text-align:center">-</td>
<td style="text-align:center">切换拖拽锁定, 如需编辑EXCEL图形组件, 一般需要锁定</td>
</tr>
<tr>
<td style="text-align:left">弹窗方式</td>
<td style="text-align:center">-</td>
<td style="text-align:center">切换编辑器是嵌入方式还是新开页面</td>
</tr>
<tr>
<td style="text-align:left">自定义主题</td>
<td style="text-align:center">-</td>
<td style="text-align:center">修改echarts的主题, 仅当前仪表盘有效</td>
</tr>
<tr>
<td style="text-align:left">调试</td>
<td style="text-align:center">-</td>
<td style="text-align:center">切换是否显示调试打印的日志,如打开后可以进行精确拖拽定位</td>
</tr>
<tr>
<td style="text-align:left">主题选择</td>
<td style="text-align:center">-</td>
<td style="text-align:center">切换显示内置echarts主题</td>
</tr>
<tr>
<td style="text-align:left">预览</td>
<td style="text-align:center">-</td>
<td style="text-align:center">切换开发模式下的预览模式</td>
</tr>
<tr>
<td style="text-align:left">数据集</td>
<td style="text-align:center">-</td>
<td style="text-align:center">菜单栏会显示未激活/通用/懒加载数据集</td>
</tr>
</tbody>
</table>
<h3 id="仪表盘容器菜单">
仪表盘容器菜单
<a class="anchor" href="#%e4%bb%aa%e8%a1%a8%e7%9b%98%e5%ae%b9%e5%99%a8%e8%8f%9c%e5%8d%95">#</a>
</h3>
<table>
<thead>
<tr>
<th style="text-align:left">功能项</th>
<th style="text-align:center">子项</th>
<th style="text-align:center">使用说明</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align:left">序号</td>
<td style="text-align:center">-</td>
<td style="text-align:center">唯一标识容器ID,可以通过 #container_序号 来选择容器, 如样式选择:#container_0{}, JS选择:$(&rsquo;#container_0&rsquo;).xx</td>
</tr>
<tr>
<td style="text-align:left">数据集开发</td>
<td style="text-align:center">-</td>
<td style="text-align:center">打开数据集开发界面, 可切换数据源,数据定时刷新,数据开发&hellip;</td>
</tr>
<tr>
<td style="text-align:left">图形开发</td>
<td style="text-align:center">-</td>
<td style="text-align:center">打开图形开发界面, 可进行实时图形配置调试, 切换内置图形, 自定义图形, 图形商店&hellip;</td>
</tr>
<tr>
<td style="text-align:left">容器开发</td>
<td style="text-align:center">-</td>
<td style="text-align:center">打开容器开发界面, 进行栅格布局调整, 拖拽方式不常用&hellip;</td>
</tr>
<tr>
<td style="text-align:left">隐藏容器</td>
<td style="text-align:center">-</td>
<td style="text-align:center">将容器切换为未激活状态,如果永久删除&hellip;</td>
</tr>
</tbody>
</table>
<h3 id="高级设定">
高级设定
<a class="anchor" href="#%e9%ab%98%e7%ba%a7%e8%ae%be%e5%ae%9a">#</a>
</h3>
<p>
<img referrerpolicy="no-referrer" src="https://foruda.gitee.com/images/1669429859879258940/b161798a_5500438.png" alt="输入图片说明" title="屏幕截图"/></p>
<table>
<thead>
<tr>
<th style="text-align:left">功能项</th>
<th style="text-align:center">子项</th>
<th style="text-align:center">使用说明</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align:left">模板开关</td>
<td style="text-align:center">-</td>
<td style="text-align:center">开启模板开发, 新增拖拽图形后会自动开启</td>
</tr>
<tr>
<td style="text-align:left">移动适配开关</td>
<td style="text-align:center">-</td>
<td style="text-align:center">不固定宽高比例模式, 如果非大屏建意开启</td>
</tr>
<tr>
<td style="text-align:left">VUE</td>
<td style="text-align:center">-</td>
<td style="text-align:center">开启后可以使用VUE模式开发</td>
</tr>
<tr>
<td style="text-align:left">DATAV</td>
<td style="text-align:center">-</td>
<td style="text-align:center">开启后可以使用DATAV的组件及VUE</td>
</tr>
<tr>
<td style="text-align:left">极简菜单</td>
<td style="text-align:center">-</td>
<td style="text-align:center">开启后隐藏仪表盘中不常用工具图标</td>
</tr>
<tr>
<td style="text-align:left">数据集模式</td>
<td style="text-align:center">-</td>
<td style="text-align:center">开启后仅用于查看和管理数据集</td>
</tr>
<tr>
<td style="text-align:left">背景模板</td>
<td style="text-align:center">-</td>
<td style="text-align:center">可选择预设的大屏背景</td>
</tr>
</tbody>
</table>
<h3 id="数据集开发">
数据集开发
<a class="anchor" href="#%e6%95%b0%e6%8d%ae%e9%9b%86%e5%bc%80%e5%8f%91">#</a>
</h3>
<p>
<img referrerpolicy="no-referrer" src="https://foruda.gitee.com/images/1669430117687266991/eba6a36a_5500438.png" alt="输入图片说明" title="屏幕截图"/></p>
<table>
<thead>
<tr>
<th style="text-align:left">功能项</th>
<th style="text-align:center">子项</th>
<th style="text-align:center">使用说明</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align:left">标题</td>
<td style="text-align:center">修改名称</td>
<td style="text-align:center">修改数据集名称</td>
</tr>
<tr>
<td style="text-align:left">标题</td>
<td style="text-align:center">联动设定</td>
<td style="text-align:center">图形联动相关的配置</td>
</tr>
<tr>
<td style="text-align:left">标题</td>
<td style="text-align:center">权限设定</td>
<td style="text-align:center">数据集权限管理</td>
</tr>
<tr>
<td style="text-align:left">主题</td>
<td style="text-align:center">-</td>
<td style="text-align:center">全局变更编辑器主题</td>
</tr>
<tr>
<td style="text-align:left">数据源</td>
<td style="text-align:center">-</td>
<td style="text-align:center">点击显示默认数据库的表清单</td>
</tr>
<tr>
<td style="text-align:left">数据源</td>
<td style="text-align:center">切换数据源</td>
<td style="text-align:center">切换数据源</td>
</tr>
<tr>
<td style="text-align:left">数据源</td>
<td style="text-align:center">编辑数据源</td>
<td style="text-align:center">编辑当前数据源配置</td>
</tr>
<tr>
<td style="text-align:left">数据源</td>
<td style="text-align:center">新增数据源</td>
<td style="text-align:center">新增数据源</td>
</tr>
<tr>
<td style="text-align:left">数据源</td>
<td style="text-align:center">刷新设定</td>
<td style="text-align:center">设定数据集的后台缓存及前端刷新间隔时间</td>
</tr>
<tr>
<td style="text-align:left">数据源</td>
<td style="text-align:center">数据库清单</td>
<td style="text-align:center">获取当前数据源所有的数据库清单</td>
</tr>
<tr>
<td style="text-align:left">数据源</td>
<td style="text-align:center">表清单</td>
<td style="text-align:center">不选择数据库时, 获取默认数据库表清单, 选中数据库名称,可获取选中数据库表清单</td>
</tr>
<tr>
<td style="text-align:left">数据源</td>
<td style="text-align:center">表结构</td>
<td style="text-align:center">选中表名,可获取表的字段描述</td>
</tr>
<tr>
<td style="text-align:left">数据源</td>
<td style="text-align:center">建表语句</td>
<td style="text-align:center">选中表名,可获取表的建表语句</td>
</tr>
<tr>
<td style="text-align:left">数据源</td>
<td style="text-align:center">表样列</td>
<td style="text-align:center">选中表名,可获取表的样列数据</td>
</tr>
<tr>
<td style="text-align:left">数据源</td>
<td style="text-align:center">表条数</td>
<td style="text-align:center">选中表名,可获取表的总条数, 也可选中一段查询获取总条数</td>
</tr>
<tr>
<td style="text-align:left">执行</td>
<td style="text-align:center">-</td>
<td style="text-align:center">执行预览数据集,或选中一段脚本执行</td>
</tr>
<tr>
<td style="text-align:left">保存数据集</td>
<td style="text-align:center">-</td>
<td style="text-align:center">保存并刷新数据集后台缓存</td>
</tr>
</tbody>
</table>
<h3 id="图形开发">
图形开发
<a class="anchor" href="#%e5%9b%be%e5%bd%a2%e5%bc%80%e5%8f%91">#</a>
</h3>
<p>
<img referrerpolicy="no-referrer" src="https://foruda.gitee.com/images/1669430349247348908/16b9f410_5500438.png" alt="输入图片说明" title="屏幕截图"/></p>
<table>
<thead>
<tr>
<th style="text-align:left">功能项</th>
<th style="text-align:center">子项</th>
<th style="text-align:center">使用说明</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align:left">实时调试</td>
<td style="text-align:center">-</td>
<td style="text-align:center">默认开启, 修改配置后, 实时显示图形, 当大量数据处理时, 建意关闭</td>
</tr>
<tr>
<td style="text-align:left">调色板</td>
<td style="text-align:center">-</td>
<td style="text-align:center">可进行颜色选择, 需复制颜色代码到配置项</td>
</tr>
<tr>
<td style="text-align:left">图形</td>
<td style="text-align:center">基础图形</td>
<td style="text-align:center">系统内置基础图形, 如柱/线/点/饼/中国式报表&hellip;, 可通过配制衍生出各种图形..</td>
</tr>
<tr>
<td style="text-align:left">图形</td>
<td style="text-align:center">个人图形</td>
<td style="text-align:center">可以保存个人修改或转化过的图形进行复用</td>
</tr>
<tr>
<td style="text-align:left">图形</td>
<td style="text-align:center">图形商店</td>
<td style="text-align:center">参考smartchart官方样列图形, 复制粘贴即可使用</td>
</tr>
<tr>
<td style="text-align:left">图形</td>
<td style="text-align:center">Echarts社区</td>
<td style="text-align:center">参考echarts官方样列图形, 复制粘贴后转化即可使用</td>
</tr>
<tr>
<td style="text-align:left">参考</td>
<td style="text-align:center">-</td>
<td style="text-align:center">常用的echarts配置项菜单, 复制粘贴即可使用</td>
</tr>
<tr>
<td style="text-align:left">工具</td>
<td style="text-align:center">转化</td>
<td style="text-align:center">将echarts原生图形转化为smartchart</td>
</tr>
<tr>
<td style="text-align:left">工具</td>
<td style="text-align:center">代码</td>
<td style="text-align:center">代码折叠/展开等</td>
</tr>
</tbody>
</table>
<h3 id="模板开发">
模板开发
<a class="anchor" href="#%e6%a8%a1%e6%9d%bf%e5%bc%80%e5%8f%91">#</a>
</h3>
<table>
<thead>
<tr>
<th style="text-align:left">功能项</th>
<th style="text-align:center">子项</th>
<th style="text-align:center">使用说明</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align:left">图形</td>
<td style="text-align:center">-</td>
<td style="text-align:center">适用于在将静态模板转化过程中或复杂布局场景使用, 常规建意采用在仪表盘界面中新增</td>
</tr>
<tr>
<td style="text-align:left">容器</td>
<td style="text-align:center">拖拽</td>
<td style="text-align:center">选中组件代码段, 将为组件加上拖拽容器代码</td>
</tr>
<tr>
<td style="text-align:left">容器</td>
<td style="text-align:center">栅格</td>
<td style="text-align:center">选中组件代码段, 将为组件加上栅格容器代码</td>
</tr>
<tr>
<td style="text-align:left">容器</td>
<td style="text-align:center">DATAV边框</td>
<td style="text-align:center">选中组件代码段, 将为组件加上DATAV边框容器代码</td>
</tr>
<tr>
<td style="text-align:left">编辑</td>
<td style="text-align:center">数据集</td>
<td style="text-align:center">选中带图形的代码段div_list.xx, 打开数据集编辑, 可用快捷键CTRL+Q</td>
</tr>
<tr>
<td style="text-align:left">编辑</td>
<td style="text-align:center">图形</td>
<td style="text-align:center">选中带图形的代码段, 打开图形编辑</td>
</tr>
<tr>
<td style="text-align:left">编辑</td>
<td style="text-align:center">容器</td>
<td style="text-align:center">选中带图形的代码段, 打开容器编辑</td>
</tr>
<tr>
<td style="text-align:left">样式</td>
<td style="text-align:center">-</td>
<td style="text-align:center">常样html组件样式, 如背景颜色, 字体..</td>
</tr>
<tr>
<td style="text-align:left">组件</td>
<td style="text-align:center">-</td>
<td style="text-align:center">常用html组件, 如图片, 按钮, 轮播..</td>
</tr>
<tr>
<td style="text-align:left">UI组件</td>
<td style="text-align:center">-</td>
<td style="text-align:center">常用elementUI组件, 使用方法需参考文档</td>
</tr>
<tr>
<td style="text-align:left">3D模型</td>
<td style="text-align:center">-</td>
<td style="text-align:center">加载并使用3D模型场景</td>
</tr>
<tr>
<td style="text-align:left">资源</td>
<td style="text-align:center">-</td>
<td style="text-align:center">不太常用的资源, 如加载词云, 地图&hellip;</td>
</tr>
<tr>
<td style="text-align:left">工具</td>
<td style="text-align:center">-</td>
<td style="text-align:center">代码折叠,对齐转化,快照定存,文件上传,数据集批量授权..</td>
</tr>
</tbody>
</table>
</article>
<footer class="book-footer">
<div class="flex flex-wrap justify-between">
<div>
<a class="flex align-center" href="https://gitee.com/smartchart/smartchart/docs/content/docs/1.%e5%9f%ba%e7%a1%80%e6%93%8d%e4%bd%9c/%e5%bf%ab%e9%80%9f%e5%bc%80%e5%a7%8b.md" target="_blank" rel="noopener">
<img src="/svg/edit.svg" class="book-icon" alt="Edit" />
<span>Edit this page</span>
</a>
</div>
</div>
<script>(function(){function e(e){const t=window.getSelection(),n=document.createRange();n.selectNodeContents(e),t.removeAllRanges(),t.addRange(n)}document.querySelectorAll("pre code").forEach(t=>{t.addEventListener("click",function(){if(window.getSelection().toString())return;e(t.parentElement),navigator.clipboard&&navigator.clipboard.writeText(t.parentElement.textContent)})})})()</script>
</footer>
<div class="book-comments">
</div>
<label for="menu-control" class="hidden book-menu-overlay"></label>
</div>
<aside class="book-toc">
<div class="book-toc-content">
<nav id="TableOfContents">
<ul>
<li>
<ul>
<li>
<ul>
<li><a href="#开发前视屏">开发前视屏</a></li>
<li><a href="#安装python环境">安装Python环境</a></li>
<li><a href="#安装smartchart">安装SmartChart</a></li>
<li><a href="#启动smartchart">启动smartchart</a></li>
<li><a href="#查看demo">查看demo</a></li>
<li><a href="#仪表盘菜单">仪表盘菜单</a></li>
<li><a href="#仪表盘容器菜单">仪表盘容器菜单</a></li>
<li><a href="#高级设定">高级设定</a></li>
<li><a href="#数据集开发">数据集开发</a></li>
<li><a href="#图形开发">图形开发</a></li>
<li><a href="#模板开发">模板开发</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</nav>
</div>
</aside>
</main>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink