From 21b52f938fde0027b26bce9eeb6a91e92b583fb0 Mon Sep 17 00:00:00 2001
From: JohnYan <84345999@qq.com>
Date: Sat, 11 Mar 2023 10:15:04 +0800
Subject: [PATCH] v6.2

---
 README.md                                     |  18 +++-
 docs/404.html                                 |   2 +-
 docs/categories/index.html                    |   2 +-
 .../1.基础操作/VUE相关/DataV应用/index.html   |   2 +-
 .../1.基础操作/VUE相关/ElementUI/index.html   |   2 +-
 docs/docs/1.基础操作/VUE相关/index.html       |   2 +-
 .../1.基础操作/VUE相关/使用VUE/index.html     |   2 +-
 docs/docs/1.基础操作/index.html               |   2 +-
 docs/docs/1.基础操作/index.xml                |   3 +-
 docs/docs/1.基础操作/不太重要/index.html      |   2 +-
 .../不太重要/主题应用PRO/index.html           |   2 +-
 .../1.基础操作/不太重要/复制仪表盘/index.html |   2 +-
 docs/docs/1.基础操作/专业版说明/index.html    |   2 +-
 docs/docs/1.基础操作/创建连接池/index.html    |   2 +-
 docs/docs/1.基础操作/应用模板/index.html      |   2 +-
 docs/docs/1.基础操作/快速开始/index.html      |   2 +-
 docs/docs/1.基础操作/权限管理/index.html      |   2 +-
 docs/docs/1.基础操作/第一个3D场景/index.html  |   2 +-
 .../1.基础操作/第一个上线数据集/index.html    |   2 +-
 docs/docs/1.基础操作/第一个仪表盘/index.html  |   2 +-
 .../docs/1.基础操作/第一个复杂报表/index.html |  35 +++++-
 docs/docs/10.其它/FAQ/index.html              |   2 +-
 docs/docs/10.其它/index.html                  |   2 +-
 docs/docs/10.其它/试用激活说明/index.html     |   2 +-
 .../Linux/SQLite3版本错误/index.html          |   2 +-
 docs/docs/11.部署指南/Linux/index.html        |   2 +-
 .../11.部署指南/Linux/快速开始/index.html     |   2 +-
 .../11.部署指南/Linux/生产部署/index.html     |   2 +-
 docs/docs/11.部署指南/index.html              |   2 +-
 docs/docs/2.数据集说明/SQL数据集/index.html   |   2 +-
 docs/docs/2.数据集说明/index.html             |   2 +-
 .../2.数据集说明/数据集开发界面/index.html    |   2 +-
 docs/docs/2.数据集说明/数据集形态/index.html  |   2 +-
 docs/docs/2.数据集说明/数据集形态/index.xml   |  12 +--
 .../数据集形态/共享数据集/index.html          |   2 +-
 .../数据集形态/数据集懒加载/index.html        | 100 +++++++++++-------
 .../2.数据集说明/数据集数据刷新/index.html    |   2 +-
 .../特殊数据源/API数据集/index.html           |  67 +++++++++---
 .../特殊数据源/Elasticsearch数据源/index.html |   2 +-
 .../特殊数据源/JDBC数据源/index.html          |   2 +-
 .../特殊数据源/Python数据集/index.html        |   2 +-
 .../特殊数据源/Redis数据源/index.html         |   2 +-
 docs/docs/2.数据集说明/特殊数据源/index.html  |   2 +-
 docs/docs/2.数据集说明/特殊数据源/index.xml   |   8 +-
 .../特殊数据源/kafka数据源/index.html         |   2 +-
 .../特殊数据源/mongodb数据源/index.html       |   2 +-
 .../特殊数据源/promitheus数据源/index.html    |   2 +-
 .../特殊数据源/sqlalchemy连接/index.html      |   2 +-
 .../特殊数据源/webSocket方式/index.html       |   2 +-
 .../特殊数据源/使用EXCEL数据/index.html       |   2 +-
 .../特殊数据源/自定义数据源/index.html        |   2 +-
 docs/docs/3.图形开发/Echarts组件/index.html   |   2 +-
 docs/docs/3.图形开发/ElementUI组件/index.html |   2 +-
 .../ElementUI组件/带分页的表格/index.html     |   2 +-
 docs/docs/3.图形开发/HTML组件/index.html      |   2 +-
 docs/docs/3.图形开发/index.html               |   2 +-
 .../函数方法/Jquery遍历方法/index.html        |   2 +-
 docs/docs/3.图形开发/函数方法/index.html      |   2 +-
 .../函数方法/图形端数据函数/index.html        |   2 +-
 docs/docs/3.图形开发/基础图形/index.html      |   2 +-
 .../3.图形开发/特殊图形/LineUp图形/index.html |   2 +-
 docs/docs/3.图形开发/特殊图形/index.html      |   2 +-
 .../3.图形开发/特殊图形/使用图标/index.html   |   2 +-
 .../3.图形开发/特殊图形/无缝滚动/index.html   |   2 +-
 .../特殊图形/特殊图形加载/index.html          |   2 +-
 docs/docs/3.图形开发/管理图形/index.html      |   2 +-
 docs/docs/3.图形开发/调试日志/index.html      |   2 +-
 docs/docs/4.布局说明/index.html               |   2 +-
 docs/docs/4.布局说明/删除容器/index.html      |   2 +-
 docs/docs/4.布局说明/布局指引/index.html      |   2 +-
 docs/docs/4.布局说明/拖拽自动对齐/index.html  |   2 +-
 docs/docs/5.参数及联动钻取/index.html         |   2 +-
 docs/docs/5.参数及联动钻取/index.xml          |   2 +-
 .../5.参数及联动钻取/参数编写方法/index.html  |   2 +-
 .../5.参数及联动钻取/图形联动钻取/index.html  |   9 +-
 .../5.参数及联动钻取/筛选器指南/index.html    |   2 +-
 .../组件自定义联动/index.html                 |   2 +-
 docs/docs/6.进阶开发PRO/index.html            |   2 +-
 .../低代码开发/IDE开发模式/index.html         |   2 +-
 docs/docs/6.进阶开发PRO/低代码开发/index.html |   2 +-
 .../低代码开发/上传资源文件/index.html        |   2 +-
 .../低代码开发/动画效果/index.html            |   2 +-
 .../低代码开发/快捷开发/index.html            |   2 +-
 .../低代码开发/样式快速上手/index.html        |   2 +-
 .../低代码开发/模板开发界面/index.html        |   2 +-
 .../低代码开发/编辑器快捷键/index.html        |   2 +-
 .../低代码开发/边框与装饰/index.html          |   2 +-
 .../6.进阶开发PRO/备份恢复及版本/index.html   |   2 +-
 .../6.进阶开发PRO/实战大屏模板转化/index.html |   2 +-
 docs/docs/6.进阶开发PRO/数据服务/index.html   |   2 +-
 .../数据服务/后台API刷新/index.html           |   2 +-
 .../数据服务/数据下载/index.html              |   2 +-
 .../数据服务/数据填报/index.html              |   2 +-
 .../数据服务/数据服务API/index.html           |   2 +-
 docs/docs/6.进阶开发PRO/自定义首页/index.html |   2 +-
 docs/docs/7.报表嵌入/index.html               |   2 +-
 docs/docs/7.报表嵌入/单点登录/index.html      |   2 +-
 docs/docs/7.报表嵌入/单页面嵌入/index.html    |   2 +-
 docs/docs/7.报表嵌入/简单嵌入/index.html      |   2 +-
 docs/docs/8.Django应用/FAQ/index.html         |   2 +-
 docs/docs/8.Django应用/index.html             |   2 +-
 .../8.Django应用/嵌入Django-Apps/index.html   |   2 +-
 .../Jupyter中使用指引/index.html              |   2 +-
 docs/docs/9.Jupyter应用/index.html            |   2 +-
 docs/docs/index.html                          |   2 +-
 docs/docs/关于我们/index.html                 |   2 +-
 docs/docs/设计理念/index.html                 |   2 +-
 ...e4e6acaccc22ec5373b70cf48ca13d81d32ca.json |   1 +
 ...c29d64a2bd8b29421c692138c3702977e76b3.json |   1 -
 ...16e7c22b3b43cfba14681803425f7dfb33a19e.js} |   2 +-
 docs/index.html                               |   2 +-
 docs/index.xml                                |  25 +++--
 docs/tags/index.html                          |   2 +-
 113 files changed, 293 insertions(+), 190 deletions(-)
 create mode 100644 docs/en.search-data.min.3cafa0b94e37157671ea76c2a8be4e6acaccc22ec5373b70cf48ca13d81d32ca.json
 delete mode 100644 docs/en.search-data.min.76743e701847269b6e3a92d8a5dc29d64a2bd8b29421c692138c3702977e76b3.json
 rename docs/{en.search.min.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js => en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js} (90%)

diff --git a/README.md b/README.md
index 5718301..0f488a6 100644
--- a/README.md
+++ b/README.md
@@ -16,7 +16,7 @@
 </p>
 
 <p align="center">
-    <img src="https://img.shields.io/badge/Release-V6.1-green.svg" alt="Downloads">
+    <img src="https://img.shields.io/badge/Release-V6.2-green.svg" alt="Downloads">
 	<a target="_blank" href="https://www.python.org/downloads/release/python-390/">
 		<img src="https://img.shields.io/badge/Python-3.6+-green.svg" />
 	</a>
@@ -47,12 +47,15 @@
 - 简单, 敏捷, 高效, 通用化, 高度可定制化, 让你的项目瞬间档次提升
 - 完全真正打通前后端, 支持图形数据联动,筛选,钻取, 支持几乎常见的所有数据库
 - 积木式拖拽开发模式, 开箱即用, 安装简单, 依赖少, 适应各种平台
-- 支持Django插件方式应用, 支持数据分析Jupyter方式应用
 - 支持中国式报表类EXCEL开发, 支持3D场景大屏
 - 内存加速技术, 让你的数据快人一步, 大幅减少数据库压力
-- 所见即所得的拖拽开发模式, 无需在画布上设计
-- 支持websocket, 数据填报设计,前端埋点, 数据服务API低代码开发
+- 真所见即所得的拖拽开发模式, 且无需在画布上设计
+- 支持数据填报设计,数据下载,前端埋点,问卷开发
+- 数据集即服务, 采用低代码快速实现数据服务API开发
 - 支持仪表盘备份恢复快照等, 满足企业级的版本控制开发上线流程要求
+- 支持用户/组功能权限控制,支持行级别/字段级别数据权限控制
+- 支持Django插件方式应用,可无限扩展,打造你专属的个性化应用
+- 支持在Jupyter notebook中的数据开发方式应用
 - 没有重复学习成本, 高度可定制化, 注意是高度可定制化!!
 
 具体功能预览可观看视屏了解, [6.0介绍视屏](https://www.bilibili.com/video/BV1Md4y1h7iq) 
@@ -297,6 +300,13 @@ v6.1
 - 优化图形配置提示
 - 优化数据集预览表格
 - 优化图标
+v6.2
+- 新增数据集预览时下载功能
+- 新增复杂报表填充方向及格式功能
+- 新增仪表盘缩略图设定
+- 优化sql执行日志
+- 优化sql commit
+- 修复登录后仪表盘url无参数
 ```
 
 
diff --git a/docs/404.html b/docs/404.html
index c752013..f9482a4 100644
--- a/docs/404.html
+++ b/docs/404.html
@@ -16,7 +16,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/categories/index.html b/docs/categories/index.html
index f8ec5f8..987fd66 100644
--- a/docs/categories/index.html
+++ b/docs/categories/index.html
@@ -15,7 +15,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <link rel="alternate" type="application/rss+xml" href="https://help.smartchart.cn/categories/index.xml" title="Smartchart开发手册" />
diff --git a/docs/docs/1.基础操作/VUE相关/DataV应用/index.html b/docs/docs/1.基础操作/VUE相关/DataV应用/index.html
index 82a4454..e23f8ed 100644
--- a/docs/docs/1.基础操作/VUE相关/DataV应用/index.html
+++ b/docs/docs/1.基础操作/VUE相关/DataV应用/index.html
@@ -21,7 +21,7 @@ DataV配置方法文档: 图表" />
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/1.基础操作/VUE相关/ElementUI/index.html b/docs/docs/1.基础操作/VUE相关/ElementUI/index.html
index 75c4658..48827cb 100644
--- a/docs/docs/1.基础操作/VUE相关/ElementUI/index.html
+++ b/docs/docs/1.基础操作/VUE相关/ElementUI/index.html
@@ -27,7 +27,7 @@ let dataset = __dataset__; let tableData = ds_createMap_all(dataset); vapp.d0={
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/1.基础操作/VUE相关/index.html b/docs/docs/1.基础操作/VUE相关/index.html
index 39ba7de..c239079 100644
--- a/docs/docs/1.基础操作/VUE相关/index.html
+++ b/docs/docs/1.基础操作/VUE相关/index.html
@@ -15,7 +15,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <link rel="alternate" type="application/rss+xml" href="https://help.smartchart.cn/docs/1.%E5%9F%BA%E7%A1%80%E6%93%8D%E4%BD%9C/VUE%E7%9B%B8%E5%85%B3/index.xml" title="Smartchart开发手册" />
diff --git a/docs/docs/1.基础操作/VUE相关/使用VUE/index.html b/docs/docs/1.基础操作/VUE相关/使用VUE/index.html
index bebf391..086bc4b 100644
--- a/docs/docs/1.基础操作/VUE相关/使用VUE/index.html
+++ b/docs/docs/1.基础操作/VUE相关/使用VUE/index.html
@@ -23,7 +23,7 @@ vapp.d0 = { &#39;index1&#39;: 100, &#39;index2&#39;: 300} 注意,我们修改了
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/1.基础操作/index.html b/docs/docs/1.基础操作/index.html
index a0e3eb0..ce051ed 100644
--- a/docs/docs/1.基础操作/index.html
+++ b/docs/docs/1.基础操作/index.html
@@ -15,7 +15,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <link rel="alternate" type="application/rss+xml" href="https://help.smartchart.cn/docs/1.%E5%9F%BA%E7%A1%80%E6%93%8D%E4%BD%9C/index.xml" title="Smartchart开发手册" />
diff --git a/docs/docs/1.基础操作/index.xml b/docs/docs/1.基础操作/index.xml
index 4565853..a01fbbd 100644
--- a/docs/docs/1.基础操作/index.xml
+++ b/docs/docs/1.基础操作/index.xml
@@ -48,7 +48,8 @@ pip3 install smartchart 如果安装过程慢,建意使用 pip3 install -i https
       
       <guid>https://help.smartchart.cn/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/</guid>
       <description>新建仪表盘 # 在开发模式下，滑动“开发管理” -&amp;gt;&amp;ldquo;仪表盘&amp;rdquo;-&amp;gt; &amp;ldquo;新增Dashboard&amp;rdquo; 填写相应信息后点击“保存” 点击进入仪表盘开发, 注意点击 &amp;ldquo;E&amp;rdquo; 字!! 点击新增&amp;ndash;&amp;gt;复杂报表 数据集编辑 # 点开“数据集” 输入以下SQL后，点击“保存并刷新”, 关闭数据集编辑界面 select H1 as 英雄名称, sum(qty) as 英雄1出场数 from smartdemo2 group by H1 order by sum(qty) desc; select count(1) as 总出场数 from smartdemo2 报表页面开发 # 和excel一样, 编辑相应表格 点击&amp;quot;数据集图标&amp;quot;(再次点击隐藏), 显示数据集字段名, 选中单元格, 单击字段名填入 点击&amp;quot;获取数据&amp;quot;, 可对真实数据调整样式 点击&amp;quot;保存&amp;quot; 点击&amp;quot;预览&amp;quot;, 可查看最终效果 导入EXCEL/WPS开发的模板 # 你也可直接导入excel或wps开发好的模板, 点击左下方的上传即可
-当然我们还有更多可定制的功能, 自行探索吧 也可购买专业版本解锁高级用法</description>
+关于自动填充方式 # 填充方向 # 默认的填充方向, 是按列方向向下填充 如果需要按行方向向右填充, 可在单元格字段标识后面加上__, 如下:
+#df0.英雄名称__ 格式填充 # 默认不会填充格式, 采用单元格自身的格式 如果需要自动采用&amp;quot;单元格字段标识&amp;quot;的格式, 可在单元格字段标识后面加上!</description>
     </item>
     
     <item>
diff --git a/docs/docs/1.基础操作/不太重要/index.html b/docs/docs/1.基础操作/不太重要/index.html
index 878b2a4..4f2ccaa 100644
--- a/docs/docs/1.基础操作/不太重要/index.html
+++ b/docs/docs/1.基础操作/不太重要/index.html
@@ -15,7 +15,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <link rel="alternate" type="application/rss+xml" href="https://help.smartchart.cn/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/index.xml" title="Smartchart开发手册" />
diff --git a/docs/docs/1.基础操作/不太重要/主题应用PRO/index.html b/docs/docs/1.基础操作/不太重要/主题应用PRO/index.html
index 9f645f6..4d5df3b 100644
--- a/docs/docs/1.基础操作/不太重要/主题应用PRO/index.html
+++ b/docs/docs/1.基础操作/不太重要/主题应用PRO/index.html
@@ -17,7 +17,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/1.基础操作/不太重要/复制仪表盘/index.html b/docs/docs/1.基础操作/不太重要/复制仪表盘/index.html
index 52fb555..7b0f2e3 100644
--- a/docs/docs/1.基础操作/不太重要/复制仪表盘/index.html
+++ b/docs/docs/1.基础操作/不太重要/复制仪表盘/index.html
@@ -19,7 +19,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/1.基础操作/专业版说明/index.html b/docs/docs/1.基础操作/专业版说明/index.html
index 192fd40..dd4f7e3 100644
--- a/docs/docs/1.基础操作/专业版说明/index.html
+++ b/docs/docs/1.基础操作/专业版说明/index.html
@@ -27,7 +27,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/1.基础操作/创建连接池/index.html b/docs/docs/1.基础操作/创建连接池/index.html
index cd6eb01..a6b9a4b 100644
--- a/docs/docs/1.基础操作/创建连接池/index.html
+++ b/docs/docs/1.基础操作/创建连接池/index.html
@@ -21,7 +21,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/1.基础操作/应用模板/index.html b/docs/docs/1.基础操作/应用模板/index.html
index 7b2cf81..97b5eca 100644
--- a/docs/docs/1.基础操作/应用模板/index.html
+++ b/docs/docs/1.基础操作/应用模板/index.html
@@ -29,7 +29,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/1.基础操作/快速开始/index.html b/docs/docs/1.基础操作/快速开始/index.html
index 53ab636..ae1e65b 100644
--- a/docs/docs/1.基础操作/快速开始/index.html
+++ b/docs/docs/1.基础操作/快速开始/index.html
@@ -23,7 +23,7 @@ pip3 install smartchart 如果安装过程慢,建意使用 pip3 install -i https
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/1.基础操作/权限管理/index.html b/docs/docs/1.基础操作/权限管理/index.html
index e4bb3c6..c99dc15 100644
--- a/docs/docs/1.基础操作/权限管理/index.html
+++ b/docs/docs/1.基础操作/权限管理/index.html
@@ -21,7 +21,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/1.基础操作/第一个3D场景/index.html b/docs/docs/1.基础操作/第一个3D场景/index.html
index 33f301d..7e8c82f 100644
--- a/docs/docs/1.基础操作/第一个3D场景/index.html
+++ b/docs/docs/1.基础操作/第一个3D场景/index.html
@@ -17,7 +17,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/1.基础操作/第一个上线数据集/index.html b/docs/docs/1.基础操作/第一个上线数据集/index.html
index 2e287fa..e1ebf90 100644
--- a/docs/docs/1.基础操作/第一个上线数据集/index.html
+++ b/docs/docs/1.基础操作/第一个上线数据集/index.html
@@ -19,7 +19,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/1.基础操作/第一个仪表盘/index.html b/docs/docs/1.基础操作/第一个仪表盘/index.html
index c093cc4..3ea07fc 100644
--- a/docs/docs/1.基础操作/第一个仪表盘/index.html
+++ b/docs/docs/1.基础操作/第一个仪表盘/index.html
@@ -19,7 +19,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/1.基础操作/第一个复杂报表/index.html b/docs/docs/1.基础操作/第一个复杂报表/index.html
index 4fe7fca..eabd6e2 100644
--- a/docs/docs/1.基础操作/第一个复杂报表/index.html
+++ b/docs/docs/1.基础操作/第一个复杂报表/index.html
@@ -4,11 +4,13 @@
   <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <meta name="description" content="新建仪表盘 # 在开发模式下，滑动“开发管理” -&gt;&ldquo;仪表盘&rdquo;-&gt; &ldquo;新增Dashboard&rdquo; 填写相应信息后点击“保存” 点击进入仪表盘开发, 注意点击 &ldquo;E&rdquo; 字!! 点击新增&ndash;&gt;复杂报表 数据集编辑 # 点开“数据集” 输入以下SQL后，点击“保存并刷新”, 关闭数据集编辑界面 select H1 as 英雄名称, sum(qty) as 英雄1出场数 from smartdemo2 group by H1 order by sum(qty) desc; select count(1) as 总出场数 from smartdemo2 报表页面开发 # 和excel一样, 编辑相应表格 点击&quot;数据集图标&quot;(再次点击隐藏), 显示数据集字段名, 选中单元格, 单击字段名填入 点击&quot;获取数据&quot;, 可对真实数据调整样式 点击&quot;保存&quot; 点击&quot;预览&quot;, 可查看最终效果 导入EXCEL/WPS开发的模板 # 你也可直接导入excel或wps开发好的模板, 点击左下方的上传即可
-当然我们还有更多可定制的功能, 自行探索吧 也可购买专业版本解锁高级用法">
+关于自动填充方式 # 填充方向 # 默认的填充方向, 是按列方向向下填充 如果需要按行方向向右填充, 可在单元格字段标识后面加上__, 如下:
+#df0.英雄名称__ 格式填充 # 默认不会填充格式, 采用单元格自身的格式 如果需要自动采用&quot;单元格字段标识&quot;的格式, 可在单元格字段标识后面加上!">
 <meta name="theme-color" content="#FFFFFF">
 <meta name="color-scheme" content="light dark"><meta property="og:title" content="第一个复杂报表" />
 <meta property="og:description" content="新建仪表盘 # 在开发模式下，滑动“开发管理” -&gt;&ldquo;仪表盘&rdquo;-&gt; &ldquo;新增Dashboard&rdquo; 填写相应信息后点击“保存” 点击进入仪表盘开发, 注意点击 &ldquo;E&rdquo; 字!! 点击新增&ndash;&gt;复杂报表 数据集编辑 # 点开“数据集” 输入以下SQL后，点击“保存并刷新”, 关闭数据集编辑界面 select H1 as 英雄名称, sum(qty) as 英雄1出场数 from smartdemo2 group by H1 order by sum(qty) desc; select count(1) as 总出场数 from smartdemo2 报表页面开发 # 和excel一样, 编辑相应表格 点击&quot;数据集图标&quot;(再次点击隐藏), 显示数据集字段名, 选中单元格, 单击字段名填入 点击&quot;获取数据&quot;, 可对真实数据调整样式 点击&quot;保存&quot; 点击&quot;预览&quot;, 可查看最终效果 导入EXCEL/WPS开发的模板 # 你也可直接导入excel或wps开发好的模板, 点击左下方的上传即可
-当然我们还有更多可定制的功能, 自行探索吧 也可购买专业版本解锁高级用法" />
+关于自动填充方式 # 填充方向 # 默认的填充方向, 是按列方向向下填充 如果需要按行方向向右填充, 可在单元格字段标识后面加上__, 如下:
+#df0.英雄名称__ 格式填充 # 默认不会填充格式, 采用单元格自身的格式 如果需要自动采用&quot;单元格字段标识&quot;的格式, 可在单元格字段标识后面加上!" />
 <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/%E7%AC%AC%E4%B8%80%E4%B8%AA%E5%A4%8D%E6%9D%82%E6%8A%A5%E8%A1%A8/" /><meta property="article:section" content="docs" />
 
@@ -19,7 +21,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
@@ -1599,6 +1601,7 @@ https://github.com/alex-shpak/hugo-book
             <li><a href="#数据集编辑">数据集编辑</a></li>
             <li><a href="#报表页面开发">报表页面开发</a></li>
             <li><a href="#导入excelwps开发的模板">导入EXCEL/WPS开发的模板</a></li>
+            <li><a href="#关于自动填充方式">关于自动填充方式</a></li>
           </ul>
         </li>
       </ul>
@@ -1668,7 +1671,30 @@ https://github.com/alex-shpak/hugo-book
   <a class="anchor" href="#%e5%af%bc%e5%85%a5excelwps%e5%bc%80%e5%8f%91%e7%9a%84%e6%a8%a1%e6%9d%bf">#</a>
 </h3>
 <p>你也可直接导入excel或wps开发好的模板, 点击左下方的上传即可</p>
-<p>当然我们还有更多可定制的功能, 自行探索吧
+<h3 id="关于自动填充方式">
+  关于自动填充方式
+  <a class="anchor" href="#%e5%85%b3%e4%ba%8e%e8%87%aa%e5%8a%a8%e5%a1%ab%e5%85%85%e6%96%b9%e5%bc%8f">#</a>
+</h3>
+<h4 id="填充方向">
+  填充方向
+  <a class="anchor" href="#%e5%a1%ab%e5%85%85%e6%96%b9%e5%90%91">#</a>
+</h4>
+<p>默认的填充方向, 是按列方向向下填充
+如果需要按行方向向右填充, 可在单元格字段标识后面加上__, 如下:</p>
+<pre tabindex="0"><code>#df0.英雄名称__
+</code></pre><h4 id="格式填充">
+  格式填充
+  <a class="anchor" href="#%e6%a0%bc%e5%bc%8f%e5%a1%ab%e5%85%85">#</a>
+</h4>
+<p>默认不会填充格式, 采用单元格自身的格式
+如果需要自动采用&quot;单元格字段标识&quot;的格式, 可在单元格字段标识后面加上!, 如下:</p>
+<pre tabindex="0"><code>#df0.英雄名称!
+</code></pre><blockquote>
+<p>格式填充在数据预览不会生效, 仅在报表预览及用户模式下生效</p>
+</blockquote>
+<p>如果需要同时修改填充方向, 可标识如下:</p>
+<pre tabindex="0"><code>#df0.英雄名称!__
+</code></pre><p>当然我们还有更多可定制的功能, 自行探索吧
 也可购买专业版本解锁高级用法</p>
 </article>
  
@@ -1726,6 +1752,7 @@ https://github.com/alex-shpak/hugo-book
             <li><a href="#数据集编辑">数据集编辑</a></li>
             <li><a href="#报表页面开发">报表页面开发</a></li>
             <li><a href="#导入excelwps开发的模板">导入EXCEL/WPS开发的模板</a></li>
+            <li><a href="#关于自动填充方式">关于自动填充方式</a></li>
           </ul>
         </li>
       </ul>
diff --git a/docs/docs/10.其它/FAQ/index.html b/docs/docs/10.其它/FAQ/index.html
index ac441cb..2bbdc8d 100644
--- a/docs/docs/10.其它/FAQ/index.html
+++ b/docs/docs/10.其它/FAQ/index.html
@@ -25,7 +25,7 @@ sudo rm -rf /Library/Developer/CommandLineTools sudo rm -f /usr/bin/python3 如
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/10.其它/index.html b/docs/docs/10.其它/index.html
index d26366f..2219805 100644
--- a/docs/docs/10.其它/index.html
+++ b/docs/docs/10.其它/index.html
@@ -15,7 +15,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <link rel="alternate" type="application/rss+xml" href="https://help.smartchart.cn/docs/10.%E5%85%B6%E5%AE%83/index.xml" title="Smartchart开发手册" />
diff --git a/docs/docs/10.其它/试用激活说明/index.html b/docs/docs/10.其它/试用激活说明/index.html
index ffe3e52..213e11a 100644
--- a/docs/docs/10.其它/试用激活说明/index.html
+++ b/docs/docs/10.其它/试用激活说明/index.html
@@ -19,7 +19,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/11.部署指南/Linux/SQLite3版本错误/index.html b/docs/docs/11.部署指南/Linux/SQLite3版本错误/index.html
index 81139ff..4128a56 100644
--- a/docs/docs/11.部署指南/Linux/SQLite3版本错误/index.html
+++ b/docs/docs/11.部署指南/Linux/SQLite3版本错误/index.html
@@ -39,7 +39,7 @@ export PATH=$HOME/opt/sqlite/bin:$PATH export LD_LIBRARY_PATH=$HOME/opt/sqlite/l
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/11.部署指南/Linux/index.html b/docs/docs/11.部署指南/Linux/index.html
index 8a9a04c..fd91bab 100644
--- a/docs/docs/11.部署指南/Linux/index.html
+++ b/docs/docs/11.部署指南/Linux/index.html
@@ -15,7 +15,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <link rel="alternate" type="application/rss+xml" href="https://help.smartchart.cn/docs/11.%E9%83%A8%E7%BD%B2%E6%8C%87%E5%8D%97/Linux/index.xml" title="Smartchart开发手册" />
diff --git a/docs/docs/11.部署指南/Linux/快速开始/index.html b/docs/docs/11.部署指南/Linux/快速开始/index.html
index 72483dd..7048bdd 100644
--- a/docs/docs/11.部署指南/Linux/快速开始/index.html
+++ b/docs/docs/11.部署指南/Linux/快速开始/index.html
@@ -17,7 +17,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/11.部署指南/Linux/生产部署/index.html b/docs/docs/11.部署指南/Linux/生产部署/index.html
index bc4839b..9c3d334 100644
--- a/docs/docs/11.部署指南/Linux/生产部署/index.html
+++ b/docs/docs/11.部署指南/Linux/生产部署/index.html
@@ -17,7 +17,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/11.部署指南/index.html b/docs/docs/11.部署指南/index.html
index 2ca4ffb..267c576 100644
--- a/docs/docs/11.部署指南/index.html
+++ b/docs/docs/11.部署指南/index.html
@@ -15,7 +15,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <link rel="alternate" type="application/rss+xml" href="https://help.smartchart.cn/docs/11.%E9%83%A8%E7%BD%B2%E6%8C%87%E5%8D%97/index.xml" title="Smartchart开发手册" />
diff --git a/docs/docs/2.数据集说明/SQL数据集/index.html b/docs/docs/2.数据集说明/SQL数据集/index.html
index 4ad3dc3..38e327d 100644
--- a/docs/docs/2.数据集说明/SQL数据集/index.html
+++ b/docs/docs/2.数据集说明/SQL数据集/index.html
@@ -17,7 +17,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/2.数据集说明/index.html b/docs/docs/2.数据集说明/index.html
index 4727643..7209c27 100644
--- a/docs/docs/2.数据集说明/index.html
+++ b/docs/docs/2.数据集说明/index.html
@@ -15,7 +15,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <link rel="alternate" type="application/rss+xml" href="https://help.smartchart.cn/docs/2.%E6%95%B0%E6%8D%AE%E9%9B%86%E8%AF%B4%E6%98%8E/index.xml" title="Smartchart开发手册" />
diff --git a/docs/docs/2.数据集说明/数据集开发界面/index.html b/docs/docs/2.数据集说明/数据集开发界面/index.html
index 071636e..56da00b 100644
--- a/docs/docs/2.数据集说明/数据集开发界面/index.html
+++ b/docs/docs/2.数据集说明/数据集开发界面/index.html
@@ -19,7 +19,7 @@ Smartchart数据集与图形 从仪表盘界面中进入简易开发界面 # " /
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/2.数据集说明/数据集形态/index.html b/docs/docs/2.数据集说明/数据集形态/index.html
index 9b5db9c..1e62624 100644
--- a/docs/docs/2.数据集说明/数据集形态/index.html
+++ b/docs/docs/2.数据集说明/数据集形态/index.html
@@ -15,7 +15,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <link rel="alternate" type="application/rss+xml" href="https://help.smartchart.cn/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/index.xml" title="Smartchart开发手册" />
diff --git a/docs/docs/2.数据集说明/数据集形态/index.xml b/docs/docs/2.数据集说明/数据集形态/index.xml
index 19fab40..15d0f7d 100644
--- a/docs/docs/2.数据集说明/数据集形态/index.xml
+++ b/docs/docs/2.数据集说明/数据集形态/index.xml
@@ -21,12 +21,12 @@
       <pubDate>Mon, 01 Jan 0001 00:00:00 +0000</pubDate>
       
       <guid>https://help.smartchart.cn/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/</guid>
-      <description>应用场景 # 类似于前后端开发, 后端会提供一些接口给前端, 但前端不一定需要在一打开页面就进行查询接口, 而是当有需要时再查询, 比如数据下载, 只有当用户有下载需求时再加载, 再比如有些与后台的数据联动, 我们只需要第一次加载时只显示第一层级, 点击时再加载其它层级
-开启数据集懒加载 # 在仪表盘&amp;quot;新增&amp;quot;&amp;ndash;&amp;gt;&amp;ldquo;懒加载数据集&amp;rdquo; 这时当打开仪表盘时, 此数据集不会被加载
-应用 # 一般懒加载数据集主要是用来做数据查询的, 所以并不太需要显示图形, 所以我们主要是用于在图形中进行赋值操作 比如先在模板中定义一个全局变量: 然后修改图形编辑中的代码: 即刷新数据集时会进行变量赋值
-如果您使用VUE, 使用会更方便, 你可以直接使用vapp.变量名 = dataset进行赋值给到vue的变量空间
-查询数据 # 你可以随时手动触发数据集的刷新, 比如懒加载的数据集序号为0 你可以在你需要触发刷新的地方调用ds_refresh(0)即可刷新0号数据集并执行0号数据集中的JS代码
-TIPS 当没有修改过懒加载数据集的图形时, 默认的全局变量为 &amp;ldquo;data序号&amp;rdquo; 如懒加载数据集序号为0, 可使用data0获取数据集刷新后的数据</description>
+      <description> 应用场景 # 类似于前后端开发, 后端会提供一些接口给前端, 但前端不一定需要在一打开页面就进行查询接口, 而是当有需要时再查询, 比如数据下载, 只有当用户有下载需求时再刷新数据 再比如有些与后台的数据联动, 我们只需要第一次加载时只显示第一层级, 点击时再加载其它层级 开启数据集懒加载 # 在仪表盘&amp;quot;新增&amp;quot;&amp;ndash;&amp;gt;&amp;ldquo;懒加载数据集&amp;rdquo; 当打开仪表盘时, 此数据集不会被加载
+应用 # 刷新数据 # 你可以随时手动触发数据集的刷新, 比如懒加载的数据集序号为0, 你可在需要触发刷新的JS代码段调用ds_refresh(0), 即可刷新0号数据集并执行0号数据集图形中的JS代码
+使用数据 # 当没有修改过懒加载数据集的图形时,默认的全局变量为&amp;quot;data序号&amp;quot;, 例如懒加载数据集序号为0, 你可在任意数据集的图形或模板中使用data0来获取数据集刷新后的数据
+数据处理 # 在有些场景, 你可能需要对懒加载的数据进行一些处理, 你可以在懒加载的图形中自定义处理逻辑, 比如我们需要把数据转化成vue常用的格式, 然后给vue的变量赋值:
+let dataset = __dataset__; dataset = ds_createMap_all(dataset); vapp.ds1 = dataset; //赋值给vue 参数传递 # 在有一些场景,需要在前端获取参数, 之后触发数据查询, 比如筛选项. 你可以使用ds_setParam(&amp;lsquo;参数名&amp;rsquo;, 参数值)设定参数, 比如刷新1号数据集
+ds_setParam(&amp;#39;city&amp;#39;, &amp;#39;顺德&amp;#39;); ds_setParam(&amp;#39;province&amp;#39;, &amp;#39;广东&amp;#39;); ds_refresh(1); </description>
     </item>
     
   </channel>
diff --git a/docs/docs/2.数据集说明/数据集形态/共享数据集/index.html b/docs/docs/2.数据集说明/数据集形态/共享数据集/index.html
index 3fad752..340d7f5 100644
--- a/docs/docs/2.数据集说明/数据集形态/共享数据集/index.html
+++ b/docs/docs/2.数据集说明/数据集形态/共享数据集/index.html
@@ -19,7 +19,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/2.数据集说明/数据集形态/数据集懒加载/index.html b/docs/docs/2.数据集说明/数据集形态/数据集懒加载/index.html
index 17d36e8..353294c 100644
--- a/docs/docs/2.数据集说明/数据集形态/数据集懒加载/index.html
+++ b/docs/docs/2.数据集说明/数据集形态/数据集懒加载/index.html
@@ -3,20 +3,20 @@
 <head>
   <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
-<meta name="description" content="应用场景 # 类似于前后端开发, 后端会提供一些接口给前端, 但前端不一定需要在一打开页面就进行查询接口, 而是当有需要时再查询, 比如数据下载, 只有当用户有下载需求时再加载, 再比如有些与后台的数据联动, 我们只需要第一次加载时只显示第一层级, 点击时再加载其它层级
-开启数据集懒加载 # 在仪表盘&quot;新增&quot;&ndash;&gt;&ldquo;懒加载数据集&rdquo; 这时当打开仪表盘时, 此数据集不会被加载
-应用 # 一般懒加载数据集主要是用来做数据查询的, 所以并不太需要显示图形, 所以我们主要是用于在图形中进行赋值操作 比如先在模板中定义一个全局变量: 然后修改图形编辑中的代码: 即刷新数据集时会进行变量赋值
-如果您使用VUE, 使用会更方便, 你可以直接使用vapp.变量名 = dataset进行赋值给到vue的变量空间
-查询数据 # 你可以随时手动触发数据集的刷新, 比如懒加载的数据集序号为0 你可以在你需要触发刷新的地方调用ds_refresh(0)即可刷新0号数据集并执行0号数据集中的JS代码
-TIPS 当没有修改过懒加载数据集的图形时, 默认的全局变量为 &ldquo;data序号&rdquo; 如懒加载数据集序号为0, 可使用data0获取数据集刷新后的数据">
+<meta name="description" content=" 应用场景 # 类似于前后端开发, 后端会提供一些接口给前端, 但前端不一定需要在一打开页面就进行查询接口, 而是当有需要时再查询, 比如数据下载, 只有当用户有下载需求时再刷新数据 再比如有些与后台的数据联动, 我们只需要第一次加载时只显示第一层级, 点击时再加载其它层级 开启数据集懒加载 # 在仪表盘&quot;新增&quot;&ndash;&gt;&ldquo;懒加载数据集&rdquo; 当打开仪表盘时, 此数据集不会被加载
+应用 # 刷新数据 # 你可以随时手动触发数据集的刷新, 比如懒加载的数据集序号为0, 你可在需要触发刷新的JS代码段调用ds_refresh(0), 即可刷新0号数据集并执行0号数据集图形中的JS代码
+使用数据 # 当没有修改过懒加载数据集的图形时,默认的全局变量为&quot;data序号&quot;, 例如懒加载数据集序号为0, 你可在任意数据集的图形或模板中使用data0来获取数据集刷新后的数据
+数据处理 # 在有些场景, 你可能需要对懒加载的数据进行一些处理, 你可以在懒加载的图形中自定义处理逻辑, 比如我们需要把数据转化成vue常用的格式, 然后给vue的变量赋值:
+let dataset = __dataset__; dataset = ds_createMap_all(dataset); vapp.ds1 = dataset; //赋值给vue 参数传递 # 在有一些场景,需要在前端获取参数, 之后触发数据查询, 比如筛选项. 你可以使用ds_setParam(&lsquo;参数名&rsquo;, 参数值)设定参数, 比如刷新1号数据集
+ds_setParam(&#39;city&#39;, &#39;顺德&#39;); ds_setParam(&#39;province&#39;, &#39;广东&#39;); ds_refresh(1); ">
 <meta name="theme-color" content="#FFFFFF">
 <meta name="color-scheme" content="light dark"><meta property="og:title" content="" />
-<meta property="og:description" content="应用场景 # 类似于前后端开发, 后端会提供一些接口给前端, 但前端不一定需要在一打开页面就进行查询接口, 而是当有需要时再查询, 比如数据下载, 只有当用户有下载需求时再加载, 再比如有些与后台的数据联动, 我们只需要第一次加载时只显示第一层级, 点击时再加载其它层级
-开启数据集懒加载 # 在仪表盘&quot;新增&quot;&ndash;&gt;&ldquo;懒加载数据集&rdquo; 这时当打开仪表盘时, 此数据集不会被加载
-应用 # 一般懒加载数据集主要是用来做数据查询的, 所以并不太需要显示图形, 所以我们主要是用于在图形中进行赋值操作 比如先在模板中定义一个全局变量: 然后修改图形编辑中的代码: 即刷新数据集时会进行变量赋值
-如果您使用VUE, 使用会更方便, 你可以直接使用vapp.变量名 = dataset进行赋值给到vue的变量空间
-查询数据 # 你可以随时手动触发数据集的刷新, 比如懒加载的数据集序号为0 你可以在你需要触发刷新的地方调用ds_refresh(0)即可刷新0号数据集并执行0号数据集中的JS代码
-TIPS 当没有修改过懒加载数据集的图形时, 默认的全局变量为 &ldquo;data序号&rdquo; 如懒加载数据集序号为0, 可使用data0获取数据集刷新后的数据" />
+<meta property="og:description" content=" 应用场景 # 类似于前后端开发, 后端会提供一些接口给前端, 但前端不一定需要在一打开页面就进行查询接口, 而是当有需要时再查询, 比如数据下载, 只有当用户有下载需求时再刷新数据 再比如有些与后台的数据联动, 我们只需要第一次加载时只显示第一层级, 点击时再加载其它层级 开启数据集懒加载 # 在仪表盘&quot;新增&quot;&ndash;&gt;&ldquo;懒加载数据集&rdquo; 当打开仪表盘时, 此数据集不会被加载
+应用 # 刷新数据 # 你可以随时手动触发数据集的刷新, 比如懒加载的数据集序号为0, 你可在需要触发刷新的JS代码段调用ds_refresh(0), 即可刷新0号数据集并执行0号数据集图形中的JS代码
+使用数据 # 当没有修改过懒加载数据集的图形时,默认的全局变量为&quot;data序号&quot;, 例如懒加载数据集序号为0, 你可在任意数据集的图形或模板中使用data0来获取数据集刷新后的数据
+数据处理 # 在有些场景, 你可能需要对懒加载的数据进行一些处理, 你可以在懒加载的图形中自定义处理逻辑, 比如我们需要把数据转化成vue常用的格式, 然后给vue的变量赋值:
+let dataset = __dataset__; dataset = ds_createMap_all(dataset); vapp.ds1 = dataset; //赋值给vue 参数传递 # 在有一些场景,需要在前端获取参数, 之后触发数据查询, 比如筛选项. 你可以使用ds_setParam(&lsquo;参数名&rsquo;, 参数值)设定参数, 比如刷新1号数据集
+ds_setParam(&#39;city&#39;, &#39;顺德&#39;); ds_setParam(&#39;province&#39;, &#39;广东&#39;); ds_refresh(1); " />
 <meta property="og:type" content="article" />
 <meta property="og:url" content="https://help.smartchart.cn/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/" /><meta property="article:section" content="docs" />
 
@@ -27,7 +27,7 @@ TIPS 当没有修改过懒加载数据集的图形时, 默认的全局变量为
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
@@ -1606,7 +1606,10 @@ https://github.com/alex-shpak/hugo-book
             <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>
+            <li><a href="#数据处理">数据处理</a></li>
+            <li><a href="#参数传递">参数传递</a></li>
           </ul>
         </li>
       </ul>
@@ -1627,42 +1630,54 @@ https://github.com/alex-shpak/hugo-book
   应用场景
   <a class="anchor" href="#%e5%ba%94%e7%94%a8%e5%9c%ba%e6%99%af">#</a>
 </h3>
-<p>类似于前后端开发, 后端会提供一些接口给前端, 但前端不一定需要在一打开页面就进行查询接口, 而是当有需要时再查询,
-比如数据下载, 只有当用户有下载需求时再加载,
-再比如有些与后台的数据联动, 我们只需要第一次加载时只显示第一层级, 点击时再加载其它层级</p>
+<ul>
+<li>类似于前后端开发, 后端会提供一些接口给前端, 但前端不一定需要在一打开页面就进行查询接口, 而是当有需要时再查询,</li>
+<li>比如数据下载, 只有当用户有下载需求时再刷新数据</li>
+<li>再比如有些与后台的数据联动, 我们只需要第一次加载时只显示第一层级, 点击时再加载其它层级</li>
+</ul>
 <h3 id="开启数据集懒加载">
   开启数据集懒加载
   <a class="anchor" href="#%e5%bc%80%e5%90%af%e6%95%b0%e6%8d%ae%e9%9b%86%e6%87%92%e5%8a%a0%e8%bd%bd">#</a>
 </h3>
 <p>在仪表盘&quot;新增&quot;&ndash;&gt;&ldquo;懒加载数据集&rdquo;
-这时当打开仪表盘时, 此数据集不会被加载</p>
+当打开仪表盘时, 此数据集不会被加载</p>
 <h3 id="应用">
   应用
   <a class="anchor" href="#%e5%ba%94%e7%94%a8">#</a>
 </h3>
-<p>一般懒加载数据集主要是用来做数据查询的, 所以并不太需要显示图形, 所以我们主要是用于在图形中进行赋值操作
-比如先在模板中定义一个全局变量:
-
-  <img referrerpolicy="no-referrer" src="https://images.gitee.com/uploads/images/2022/0715/210058_ad704d9c_5500438.png" alt="输入图片说明" title="屏幕截图.png"/>
-然后修改图形编辑中的代码:
-
-  <img referrerpolicy="no-referrer" src="https://images.gitee.com/uploads/images/2022/0715/210204_b12749a3_5500438.png" alt="输入图片说明" title="屏幕截图.png"/>
-即刷新数据集时会进行变量赋值</p>
-<blockquote>
-<p>如果您使用VUE, 使用会更方便, 你可以直接使用vapp.变量名 = dataset进行赋值给到vue的变量空间</p>
-</blockquote>
-<h3 id="查询数据">
-  查询数据
-  <a class="anchor" href="#%e6%9f%a5%e8%af%a2%e6%95%b0%e6%8d%ae">#</a>
+<h3 id="刷新数据">
+  刷新数据
+  <a class="anchor" href="#%e5%88%b7%e6%96%b0%e6%95%b0%e6%8d%ae">#</a>
 </h3>
-<p>你可以随时手动触发数据集的刷新, 比如懒加载的数据集序号为0
-你可以在你需要触发刷新的地方调用ds_refresh(0)即可刷新0号数据集并执行0号数据集中的JS代码</p>
-<blockquote>
-<p>TIPS
-当没有修改过懒加载数据集的图形时, 默认的全局变量为 &ldquo;data序号&rdquo;
-如懒加载数据集序号为0, 可使用data0获取数据集刷新后的数据</p>
-</blockquote>
-</article>
+<p>你可以随时手动触发数据集的刷新, 比如懒加载的数据集序号为0,
+你可在需要触发刷新的JS代码段调用ds_refresh(0),
+即可刷新0号数据集并执行0号数据集图形中的JS代码</p>
+<h3 id="使用数据">
+  使用数据
+  <a class="anchor" href="#%e4%bd%bf%e7%94%a8%e6%95%b0%e6%8d%ae">#</a>
+</h3>
+<p>当没有修改过懒加载数据集的图形时,默认的全局变量为&quot;data序号&quot;,
+例如懒加载数据集序号为0, 你可在任意数据集的图形或模板中使用data0来获取数据集刷新后的数据</p>
+<h3 id="数据处理">
+  数据处理
+  <a class="anchor" href="#%e6%95%b0%e6%8d%ae%e5%a4%84%e7%90%86">#</a>
+</h3>
+<p>在有些场景, 你可能需要对懒加载的数据进行一些处理, 你可以在懒加载的图形中自定义处理逻辑,
+比如我们需要把数据转化成vue常用的格式, 然后给vue的变量赋值:</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-javascript" data-lang="javascript"><span style="display:flex;"><span><span style="color:#66d9ef">let</span> <span style="color:#a6e22e">dataset</span> <span style="color:#f92672">=</span> <span style="color:#a6e22e">__dataset__</span>;
+</span></span><span style="display:flex;"><span><span style="color:#a6e22e">dataset</span> <span style="color:#f92672">=</span> <span style="color:#a6e22e">ds_createMap_all</span>(<span style="color:#a6e22e">dataset</span>);
+</span></span><span style="display:flex;"><span><span style="color:#a6e22e">vapp</span>.<span style="color:#a6e22e">ds1</span> <span style="color:#f92672">=</span> <span style="color:#a6e22e">dataset</span>;  <span style="color:#75715e">//赋值给vue
+</span></span></span></code></pre></div><h3 id="参数传递">
+  参数传递
+  <a class="anchor" href="#%e5%8f%82%e6%95%b0%e4%bc%a0%e9%80%92">#</a>
+</h3>
+<p>在有一些场景,需要在前端获取参数, 之后触发数据查询, 比如筛选项.
+你可以使用ds_setParam(&lsquo;参数名&rsquo;, 参数值)设定参数,
+比如刷新1号数据集</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-javascript" data-lang="javascript"><span style="display:flex;"><span><span style="color:#a6e22e">ds_setParam</span>(<span style="color:#e6db74">&#39;city&#39;</span>, <span style="color:#e6db74">&#39;顺德&#39;</span>);
+</span></span><span style="display:flex;"><span><span style="color:#a6e22e">ds_setParam</span>(<span style="color:#e6db74">&#39;province&#39;</span>, <span style="color:#e6db74">&#39;广东&#39;</span>);
+</span></span><span style="display:flex;"><span><span style="color:#a6e22e">ds_refresh</span>(<span style="color:#ae81ff">1</span>);
+</span></span></code></pre></div></article>
  
       
 
@@ -1717,7 +1732,10 @@ https://github.com/alex-shpak/hugo-book
             <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>
+            <li><a href="#数据处理">数据处理</a></li>
+            <li><a href="#参数传递">参数传递</a></li>
           </ul>
         </li>
       </ul>
diff --git a/docs/docs/2.数据集说明/数据集数据刷新/index.html b/docs/docs/2.数据集说明/数据集数据刷新/index.html
index 524d7e5..132da7e 100644
--- a/docs/docs/2.数据集说明/数据集数据刷新/index.html
+++ b/docs/docs/2.数据集说明/数据集数据刷新/index.html
@@ -23,7 +23,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/2.数据集说明/特殊数据源/API数据集/index.html b/docs/docs/2.数据集说明/特殊数据源/API数据集/index.html
index 4eff967..20537c1 100644
--- a/docs/docs/2.数据集说明/特殊数据源/API数据集/index.html
+++ b/docs/docs/2.数据集说明/特殊数据源/API数据集/index.html
@@ -3,15 +3,19 @@
 <head>
   <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
-<meta name="description" content="对接外部API取数, 注意返回一定要是JSON格式 你只需要在数据集编辑框中如下输入
-//GET 方法: dataset= { &#34;url&#34;:&#34;https://www.smartchart.cn/smartdata/api/?i=loaddataset1&amp;j=1&#34; } //POST 方法: dataset= { &#34;url&#34;:&#34;https://www.smartchart.cn/smartdata/api&#34;, &#34;method&#34;:&#34;POST&#34;, &#34;data&#34;:{&#34;i&#34;:&#34;loaddataset1&#34;, &#34;j&#34;:&#34;1&#34;} ... } 例如你可以传入参数做出联动效果
-dataset= { &#34;url&#34;:&#34;https://www.smartchart.cn/smartdata/api&#34;, &#34;method&#34;:&#34;POST&#34;, &#34;data&#34;:{&#34;i&#34;:&#34;loaddataset1&#34;, &#34;j&#34;:&#34;/*$参数名*/&#34;} ... } 你也可以增加header等认证方式
+<meta name="description" content=" API接口要求 # 接口返回一定要是JSON格式
+数据源配置方法 # 你可选择任意数据连接
+使用方法 # 以下是简单的get及post方法样列
+//GET 方法: dataset= { &#34;url&#34;:&#34;https://www.smartchart.cn/smartdata/api/?i=loaddataset1&amp;j=1&#34; } //POST 方法: dataset= { &#34;url&#34;:&#34;https://www.smartchart.cn/smartdata/api&#34;, &#34;method&#34;:&#34;POST&#34;, &#34;data&#34;:{&#34;i&#34;:&#34;loaddataset1&#34;, &#34;j&#34;:&#34;1&#34;} ... } 可以传入参数做出联动效果
+dataset= { &#34;url&#34;:&#34;https://www.smartchart.cn/smartdata/api&#34;, &#34;method&#34;:&#34;POST&#34;, &#34;data&#34;:{&#34;i&#34;:&#34;loaddataset1&#34;, &#34;j&#34;:&#34;/*$参数名*/&#34;} ... } 可以增加header等认证方式
 dataset= { &#34;url&#34;:&#34;https://www.smartchart.cn/smartdata/api&#34;, &#34;method&#34;:&#34;GET&#34;, &#34;headers&#34;:{&#34;Cookie&#34;:&#34;xxxxxxx&#34;} ... } ">
 <meta name="theme-color" content="#FFFFFF">
 <meta name="color-scheme" content="light dark"><meta property="og:title" content="" />
-<meta property="og:description" content="对接外部API取数, 注意返回一定要是JSON格式 你只需要在数据集编辑框中如下输入
-//GET 方法: dataset= { &#34;url&#34;:&#34;https://www.smartchart.cn/smartdata/api/?i=loaddataset1&amp;j=1&#34; } //POST 方法: dataset= { &#34;url&#34;:&#34;https://www.smartchart.cn/smartdata/api&#34;, &#34;method&#34;:&#34;POST&#34;, &#34;data&#34;:{&#34;i&#34;:&#34;loaddataset1&#34;, &#34;j&#34;:&#34;1&#34;} ... } 例如你可以传入参数做出联动效果
-dataset= { &#34;url&#34;:&#34;https://www.smartchart.cn/smartdata/api&#34;, &#34;method&#34;:&#34;POST&#34;, &#34;data&#34;:{&#34;i&#34;:&#34;loaddataset1&#34;, &#34;j&#34;:&#34;/*$参数名*/&#34;} ... } 你也可以增加header等认证方式
+<meta property="og:description" content=" API接口要求 # 接口返回一定要是JSON格式
+数据源配置方法 # 你可选择任意数据连接
+使用方法 # 以下是简单的get及post方法样列
+//GET 方法: dataset= { &#34;url&#34;:&#34;https://www.smartchart.cn/smartdata/api/?i=loaddataset1&amp;j=1&#34; } //POST 方法: dataset= { &#34;url&#34;:&#34;https://www.smartchart.cn/smartdata/api&#34;, &#34;method&#34;:&#34;POST&#34;, &#34;data&#34;:{&#34;i&#34;:&#34;loaddataset1&#34;, &#34;j&#34;:&#34;1&#34;} ... } 可以传入参数做出联动效果
+dataset= { &#34;url&#34;:&#34;https://www.smartchart.cn/smartdata/api&#34;, &#34;method&#34;:&#34;POST&#34;, &#34;data&#34;:{&#34;i&#34;:&#34;loaddataset1&#34;, &#34;j&#34;:&#34;/*$参数名*/&#34;} ... } 可以增加header等认证方式
 dataset= { &#34;url&#34;:&#34;https://www.smartchart.cn/smartdata/api&#34;, &#34;method&#34;:&#34;GET&#34;, &#34;headers&#34;:{&#34;Cookie&#34;:&#34;xxxxxxx&#34;} ... } " />
 <meta property="og:type" content="article" />
 <meta property="og:url" content="https://help.smartchart.cn/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/" /><meta property="article:section" content="docs" />
@@ -23,7 +27,7 @@ dataset= { &#34;url&#34;:&#34;https://www.smartchart.cn/smartdata/api&#34;, &#34
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
@@ -1593,7 +1597,19 @@ https://github.com/alex-shpak/hugo-book
   <aside class="hidden clearfix">
     
   
-<nav id="TableOfContents"></nav>
+<nav id="TableOfContents">
+  <ul>
+    <li>
+      <ul>
+        <li>
+          <ul>
+            <li></li>
+          </ul>
+        </li>
+      </ul>
+    </li>
+  </ul>
+</nav>
 
 
 
@@ -1604,8 +1620,21 @@ https://github.com/alex-shpak/hugo-book
 
       
       
-  <article class="markdown"><p>对接外部API取数, 注意返回一定要是JSON格式
-你只需要在数据集编辑框中如下输入</p>
+  <article class="markdown"><h4 id="api接口要求">
+  API接口要求
+  <a class="anchor" href="#api%e6%8e%a5%e5%8f%a3%e8%a6%81%e6%b1%82">#</a>
+</h4>
+<p>接口返回一定要是JSON格式</p>
+<h4 id="数据源配置方法">
+  数据源配置方法
+  <a class="anchor" href="#%e6%95%b0%e6%8d%ae%e6%ba%90%e9%85%8d%e7%bd%ae%e6%96%b9%e6%b3%95">#</a>
+</h4>
+<p>你可选择任意数据连接</p>
+<h4 id="使用方法">
+  使用方法
+  <a class="anchor" href="#%e4%bd%bf%e7%94%a8%e6%96%b9%e6%b3%95">#</a>
+</h4>
+<p>以下是简单的get及post方法样列</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-js" data-lang="js"><span style="display:flex;"><span><span style="color:#75715e">//GET 方法:
 </span></span></span><span style="display:flex;"><span><span style="color:#75715e"></span><span style="color:#a6e22e">dataset</span><span style="color:#f92672">=</span> {
 </span></span><span style="display:flex;"><span><span style="color:#e6db74">&#34;url&#34;</span><span style="color:#f92672">:</span><span style="color:#e6db74">&#34;https://www.smartchart.cn/smartdata/api/?i=loaddataset1&amp;j=1&#34;</span>
@@ -1618,14 +1647,14 @@ https://github.com/alex-shpak/hugo-book
 </span></span><span style="display:flex;"><span><span style="color:#e6db74">&#34;data&#34;</span><span style="color:#f92672">:</span>{<span style="color:#e6db74">&#34;i&#34;</span><span style="color:#f92672">:</span><span style="color:#e6db74">&#34;loaddataset1&#34;</span>, <span style="color:#e6db74">&#34;j&#34;</span><span style="color:#f92672">:</span><span style="color:#e6db74">&#34;1&#34;</span>}
 </span></span><span style="display:flex;"><span> ...
 </span></span><span style="display:flex;"><span>}
-</span></span></code></pre></div><p>例如你可以传入参数做出联动效果</p>
+</span></span></code></pre></div><p>可以传入参数做出联动效果</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-js" data-lang="js"><span style="display:flex;"><span><span style="color:#a6e22e">dataset</span><span style="color:#f92672">=</span> {
 </span></span><span style="display:flex;"><span><span style="color:#e6db74">&#34;url&#34;</span><span style="color:#f92672">:</span><span style="color:#e6db74">&#34;https://www.smartchart.cn/smartdata/api&#34;</span>,
 </span></span><span style="display:flex;"><span><span style="color:#e6db74">&#34;method&#34;</span><span style="color:#f92672">:</span><span style="color:#e6db74">&#34;POST&#34;</span>,
 </span></span><span style="display:flex;"><span><span style="color:#e6db74">&#34;data&#34;</span><span style="color:#f92672">:</span>{<span style="color:#e6db74">&#34;i&#34;</span><span style="color:#f92672">:</span><span style="color:#e6db74">&#34;loaddataset1&#34;</span>, <span style="color:#e6db74">&#34;j&#34;</span><span style="color:#f92672">:</span><span style="color:#e6db74">&#34;/*$参数名*/&#34;</span>}
 </span></span><span style="display:flex;"><span>...
 </span></span><span style="display:flex;"><span>}
-</span></span></code></pre></div><p>你也可以增加header等认证方式</p>
+</span></span></code></pre></div><p>可以增加header等认证方式</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-js" data-lang="js"><span style="display:flex;"><span><span style="color:#a6e22e">dataset</span><span style="color:#f92672">=</span> {
 </span></span><span style="display:flex;"><span><span style="color:#e6db74">&#34;url&#34;</span><span style="color:#f92672">:</span><span style="color:#e6db74">&#34;https://www.smartchart.cn/smartdata/api&#34;</span>,
 </span></span><span style="display:flex;"><span><span style="color:#e6db74">&#34;method&#34;</span><span style="color:#f92672">:</span><span style="color:#e6db74">&#34;GET&#34;</span>,
@@ -1678,7 +1707,19 @@ https://github.com/alex-shpak/hugo-book
       <div class="book-toc-content">
         
   
-<nav id="TableOfContents"></nav>
+<nav id="TableOfContents">
+  <ul>
+    <li>
+      <ul>
+        <li>
+          <ul>
+            <li></li>
+          </ul>
+        </li>
+      </ul>
+    </li>
+  </ul>
+</nav>
 
 
  
diff --git a/docs/docs/2.数据集说明/特殊数据源/Elasticsearch数据源/index.html b/docs/docs/2.数据集说明/特殊数据源/Elasticsearch数据源/index.html
index 0573a8f..5807662 100644
--- a/docs/docs/2.数据集说明/特殊数据源/Elasticsearch数据源/index.html
+++ b/docs/docs/2.数据集说明/特殊数据源/Elasticsearch数据源/index.html
@@ -17,7 +17,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/2.数据集说明/特殊数据源/JDBC数据源/index.html b/docs/docs/2.数据集说明/特殊数据源/JDBC数据源/index.html
index 9ae8488..bec5353 100644
--- a/docs/docs/2.数据集说明/特殊数据源/JDBC数据源/index.html
+++ b/docs/docs/2.数据集说明/特殊数据源/JDBC数据源/index.html
@@ -19,7 +19,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/2.数据集说明/特殊数据源/Python数据集/index.html b/docs/docs/2.数据集说明/特殊数据源/Python数据集/index.html
index f766767..307dffe 100644
--- a/docs/docs/2.数据集说明/特殊数据源/Python数据集/index.html
+++ b/docs/docs/2.数据集说明/特殊数据源/Python数据集/index.html
@@ -27,7 +27,7 @@ import pandas as pd df = pd.read_excel(&#39;/Users/../smartdemo.xlsx&#39;, &#39;
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/2.数据集说明/特殊数据源/Redis数据源/index.html b/docs/docs/2.数据集说明/特殊数据源/Redis数据源/index.html
index 91f8bc7..e4c5973 100644
--- a/docs/docs/2.数据集说明/特殊数据源/Redis数据源/index.html
+++ b/docs/docs/2.数据集说明/特殊数据源/Redis数据源/index.html
@@ -31,7 +31,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/2.数据集说明/特殊数据源/index.html b/docs/docs/2.数据集说明/特殊数据源/index.html
index 77d716d..0bf549d 100644
--- a/docs/docs/2.数据集说明/特殊数据源/index.html
+++ b/docs/docs/2.数据集说明/特殊数据源/index.html
@@ -15,7 +15,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <link rel="alternate" type="application/rss+xml" href="https://help.smartchart.cn/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/index.xml" title="Smartchart开发手册" />
diff --git a/docs/docs/2.数据集说明/特殊数据源/index.xml b/docs/docs/2.数据集说明/特殊数据源/index.xml
index ef330e8..2590005 100644
--- a/docs/docs/2.数据集说明/特殊数据源/index.xml
+++ b/docs/docs/2.数据集说明/特殊数据源/index.xml
@@ -11,9 +11,11 @@
       <pubDate>Mon, 01 Jan 0001 00:00:00 +0000</pubDate>
       
       <guid>https://help.smartchart.cn/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/</guid>
-      <description>对接外部API取数, 注意返回一定要是JSON格式 你只需要在数据集编辑框中如下输入
-//GET 方法: dataset= { &amp;#34;url&amp;#34;:&amp;#34;https://www.smartchart.cn/smartdata/api/?i=loaddataset1&amp;amp;j=1&amp;#34; } //POST 方法: dataset= { &amp;#34;url&amp;#34;:&amp;#34;https://www.smartchart.cn/smartdata/api&amp;#34;, &amp;#34;method&amp;#34;:&amp;#34;POST&amp;#34;, &amp;#34;data&amp;#34;:{&amp;#34;i&amp;#34;:&amp;#34;loaddataset1&amp;#34;, &amp;#34;j&amp;#34;:&amp;#34;1&amp;#34;} ... } 例如你可以传入参数做出联动效果
-dataset= { &amp;#34;url&amp;#34;:&amp;#34;https://www.smartchart.cn/smartdata/api&amp;#34;, &amp;#34;method&amp;#34;:&amp;#34;POST&amp;#34;, &amp;#34;data&amp;#34;:{&amp;#34;i&amp;#34;:&amp;#34;loaddataset1&amp;#34;, &amp;#34;j&amp;#34;:&amp;#34;/*$参数名*/&amp;#34;} ... } 你也可以增加header等认证方式
+      <description> API接口要求 # 接口返回一定要是JSON格式
+数据源配置方法 # 你可选择任意数据连接
+使用方法 # 以下是简单的get及post方法样列
+//GET 方法: dataset= { &amp;#34;url&amp;#34;:&amp;#34;https://www.smartchart.cn/smartdata/api/?i=loaddataset1&amp;amp;j=1&amp;#34; } //POST 方法: dataset= { &amp;#34;url&amp;#34;:&amp;#34;https://www.smartchart.cn/smartdata/api&amp;#34;, &amp;#34;method&amp;#34;:&amp;#34;POST&amp;#34;, &amp;#34;data&amp;#34;:{&amp;#34;i&amp;#34;:&amp;#34;loaddataset1&amp;#34;, &amp;#34;j&amp;#34;:&amp;#34;1&amp;#34;} ... } 可以传入参数做出联动效果
+dataset= { &amp;#34;url&amp;#34;:&amp;#34;https://www.smartchart.cn/smartdata/api&amp;#34;, &amp;#34;method&amp;#34;:&amp;#34;POST&amp;#34;, &amp;#34;data&amp;#34;:{&amp;#34;i&amp;#34;:&amp;#34;loaddataset1&amp;#34;, &amp;#34;j&amp;#34;:&amp;#34;/*$参数名*/&amp;#34;} ... } 可以增加header等认证方式
 dataset= { &amp;#34;url&amp;#34;:&amp;#34;https://www.smartchart.cn/smartdata/api&amp;#34;, &amp;#34;method&amp;#34;:&amp;#34;GET&amp;#34;, &amp;#34;headers&amp;#34;:{&amp;#34;Cookie&amp;#34;:&amp;#34;xxxxxxx&amp;#34;} ... } </description>
     </item>
     
diff --git a/docs/docs/2.数据集说明/特殊数据源/kafka数据源/index.html b/docs/docs/2.数据集说明/特殊数据源/kafka数据源/index.html
index 9c70745..6481105 100644
--- a/docs/docs/2.数据集说明/特殊数据源/kafka数据源/index.html
+++ b/docs/docs/2.数据集说明/特殊数据源/kafka数据源/index.html
@@ -19,7 +19,7 @@ def dataset(*args, **kwargs): &#34;&#34;&#34; 返回查询数据集 :return: 二
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/2.数据集说明/特殊数据源/mongodb数据源/index.html b/docs/docs/2.数据集说明/特殊数据源/mongodb数据源/index.html
index 24dedcd..3c07fb1 100644
--- a/docs/docs/2.数据集说明/特殊数据源/mongodb数据源/index.html
+++ b/docs/docs/2.数据集说明/特殊数据源/mongodb数据源/index.html
@@ -27,7 +27,7 @@ let dataset=ds_mapToList(__dataset__); 参数说明： # 除table，其它都为
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/2.数据集说明/特殊数据源/promitheus数据源/index.html b/docs/docs/2.数据集说明/特殊数据源/promitheus数据源/index.html
index 26e8017..216d35e 100644
--- a/docs/docs/2.数据集说明/特殊数据源/promitheus数据源/index.html
+++ b/docs/docs/2.数据集说明/特殊数据源/promitheus数据源/index.html
@@ -25,7 +25,7 @@ let dataset=__dataset__; //获取返回值列表中的第一值 dataset = datase
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/2.数据集说明/特殊数据源/sqlalchemy连接/index.html b/docs/docs/2.数据集说明/特殊数据源/sqlalchemy连接/index.html
index 4aa3de1..2915ed6 100644
--- a/docs/docs/2.数据集说明/特殊数据源/sqlalchemy连接/index.html
+++ b/docs/docs/2.数据集说明/特殊数据源/sqlalchemy连接/index.html
@@ -19,7 +19,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/2.数据集说明/特殊数据源/webSocket方式/index.html b/docs/docs/2.数据集说明/特殊数据源/webSocket方式/index.html
index 124f3bf..35384b0 100644
--- a/docs/docs/2.数据集说明/特殊数据源/webSocket方式/index.html
+++ b/docs/docs/2.数据集说明/特殊数据源/webSocket方式/index.html
@@ -19,7 +19,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/2.数据集说明/特殊数据源/使用EXCEL数据/index.html b/docs/docs/2.数据集说明/特殊数据源/使用EXCEL数据/index.html
index cd941a0..e6e4a44 100644
--- a/docs/docs/2.数据集说明/特殊数据源/使用EXCEL数据/index.html
+++ b/docs/docs/2.数据集说明/特殊数据源/使用EXCEL数据/index.html
@@ -23,7 +23,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/2.数据集说明/特殊数据源/自定义数据源/index.html b/docs/docs/2.数据集说明/特殊数据源/自定义数据源/index.html
index d318029..c2f01f3 100644
--- a/docs/docs/2.数据集说明/特殊数据源/自定义数据源/index.html
+++ b/docs/docs/2.数据集说明/特殊数据源/自定义数据源/index.html
@@ -19,7 +19,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/3.图形开发/Echarts组件/index.html b/docs/docs/3.图形开发/Echarts组件/index.html
index db821f7..72baea1 100644
--- a/docs/docs/3.图形开发/Echarts组件/index.html
+++ b/docs/docs/3.图形开发/Echarts组件/index.html
@@ -25,7 +25,7 @@ let dataset = __dataset__ //传入dataset let legend_label = ds_rowname(dataset)
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/3.图形开发/ElementUI组件/index.html b/docs/docs/3.图形开发/ElementUI组件/index.html
index 818e230..db3d945 100644
--- a/docs/docs/3.图形开发/ElementUI组件/index.html
+++ b/docs/docs/3.图形开发/ElementUI组件/index.html
@@ -15,7 +15,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <link rel="alternate" type="application/rss+xml" href="https://help.smartchart.cn/docs/3.%E5%9B%BE%E5%BD%A2%E5%BC%80%E5%8F%91/ElementUI%E7%BB%84%E4%BB%B6/index.xml" title="Smartchart开发手册" />
diff --git a/docs/docs/3.图形开发/ElementUI组件/带分页的表格/index.html b/docs/docs/3.图形开发/ElementUI组件/带分页的表格/index.html
index 90ff00c..f15ff7a 100644
--- a/docs/docs/3.图形开发/ElementUI组件/带分页的表格/index.html
+++ b/docs/docs/3.图形开发/ElementUI组件/带分页的表格/index.html
@@ -17,7 +17,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/3.图形开发/HTML组件/index.html b/docs/docs/3.图形开发/HTML组件/index.html
index 9e3590c..811217d 100644
--- a/docs/docs/3.图形开发/HTML组件/index.html
+++ b/docs/docs/3.图形开发/HTML组件/index.html
@@ -23,7 +23,7 @@ let dataset=__dataset__; let table = &#39;&#39;; for (let i=1;i&lt;dataset.lengt
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/3.图形开发/index.html b/docs/docs/3.图形开发/index.html
index b3a270d..b2d908f 100644
--- a/docs/docs/3.图形开发/index.html
+++ b/docs/docs/3.图形开发/index.html
@@ -15,7 +15,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <link rel="alternate" type="application/rss+xml" href="https://help.smartchart.cn/docs/3.%E5%9B%BE%E5%BD%A2%E5%BC%80%E5%8F%91/index.xml" title="Smartchart开发手册" />
diff --git a/docs/docs/3.图形开发/函数方法/Jquery遍历方法/index.html b/docs/docs/3.图形开发/函数方法/Jquery遍历方法/index.html
index e60d4d9..25ff74d 100644
--- a/docs/docs/3.图形开发/函数方法/Jquery遍历方法/index.html
+++ b/docs/docs/3.图形开发/函数方法/Jquery遍历方法/index.html
@@ -25,7 +25,7 @@ parent() 获取元素的直接父元素 $(&#34;span&#34;).parent().css({ &#34;co
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/3.图形开发/函数方法/index.html b/docs/docs/3.图形开发/函数方法/index.html
index cf0ef0c..eb72b6c 100644
--- a/docs/docs/3.图形开发/函数方法/index.html
+++ b/docs/docs/3.图形开发/函数方法/index.html
@@ -15,7 +15,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <link rel="alternate" type="application/rss+xml" href="https://help.smartchart.cn/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/index.xml" title="Smartchart开发手册" />
diff --git a/docs/docs/3.图形开发/函数方法/图形端数据函数/index.html b/docs/docs/3.图形开发/函数方法/图形端数据函数/index.html
index 2463df5..dabf105 100644
--- a/docs/docs/3.图形开发/函数方法/图形端数据函数/index.html
+++ b/docs/docs/3.图形开发/函数方法/图形端数据函数/index.html
@@ -21,7 +21,7 @@ dataset = [[&#39;category&#39;,&#39;C1&#39;,&#39;C2&#39;], [&#39;R1&#39;, 12, 18
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/3.图形开发/基础图形/index.html b/docs/docs/3.图形开发/基础图形/index.html
index 51391dc..ec30997 100644
--- a/docs/docs/3.图形开发/基础图形/index.html
+++ b/docs/docs/3.图形开发/基础图形/index.html
@@ -21,7 +21,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/3.图形开发/特殊图形/LineUp图形/index.html b/docs/docs/3.图形开发/特殊图形/LineUp图形/index.html
index c1f1f0e..44dbe8e 100644
--- a/docs/docs/3.图形开发/特殊图形/LineUp图形/index.html
+++ b/docs/docs/3.图形开发/特殊图形/LineUp图形/index.html
@@ -19,7 +19,7 @@ ds_loadcss(&#39;smt_LineUp&#39;); ds_loadjs(&#39;smt_LineUp&#39;); let dataset =
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/3.图形开发/特殊图形/index.html b/docs/docs/3.图形开发/特殊图形/index.html
index ea3accc..3e6879a 100644
--- a/docs/docs/3.图形开发/特殊图形/index.html
+++ b/docs/docs/3.图形开发/特殊图形/index.html
@@ -15,7 +15,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <link rel="alternate" type="application/rss+xml" href="https://help.smartchart.cn/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/index.xml" title="Smartchart开发手册" />
diff --git a/docs/docs/3.图形开发/特殊图形/使用图标/index.html b/docs/docs/3.图形开发/特殊图形/使用图标/index.html
index 5aa445b..cfad42a 100644
--- a/docs/docs/3.图形开发/特殊图形/使用图标/index.html
+++ b/docs/docs/3.图形开发/特殊图形/使用图标/index.html
@@ -17,7 +17,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/3.图形开发/特殊图形/无缝滚动/index.html b/docs/docs/3.图形开发/特殊图形/无缝滚动/index.html
index 21b49b7..9eea52d 100644
--- a/docs/docs/3.图形开发/特殊图形/无缝滚动/index.html
+++ b/docs/docs/3.图形开发/特殊图形/无缝滚动/index.html
@@ -25,7 +25,7 @@ marconfig={ playtime: 3000, //滚动3秒 pausetime: 3000, //停3秒 config:{ dir
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/3.图形开发/特殊图形/特殊图形加载/index.html b/docs/docs/3.图形开发/特殊图形/特殊图形加载/index.html
index 36814e6..55d04db 100644
--- a/docs/docs/3.图形开发/特殊图形/特殊图形加载/index.html
+++ b/docs/docs/3.图形开发/特殊图形/特殊图形加载/index.html
@@ -19,7 +19,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/3.图形开发/管理图形/index.html b/docs/docs/3.图形开发/管理图形/index.html
index 6db9659..cfc8f80 100644
--- a/docs/docs/3.图形开发/管理图形/index.html
+++ b/docs/docs/3.图形开发/管理图形/index.html
@@ -19,7 +19,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/3.图形开发/调试日志/index.html b/docs/docs/3.图形开发/调试日志/index.html
index e07b5e1..2528894 100644
--- a/docs/docs/3.图形开发/调试日志/index.html
+++ b/docs/docs/3.图形开发/调试日志/index.html
@@ -21,7 +21,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/4.布局说明/index.html b/docs/docs/4.布局说明/index.html
index 68c0226..fc24364 100644
--- a/docs/docs/4.布局说明/index.html
+++ b/docs/docs/4.布局说明/index.html
@@ -15,7 +15,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <link rel="alternate" type="application/rss+xml" href="https://help.smartchart.cn/docs/4.%E5%B8%83%E5%B1%80%E8%AF%B4%E6%98%8E/index.xml" title="Smartchart开发手册" />
diff --git a/docs/docs/4.布局说明/删除容器/index.html b/docs/docs/4.布局说明/删除容器/index.html
index df0315c..c2d848b 100644
--- a/docs/docs/4.布局说明/删除容器/index.html
+++ b/docs/docs/4.布局说明/删除容器/index.html
@@ -17,7 +17,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/4.布局说明/布局指引/index.html b/docs/docs/4.布局说明/布局指引/index.html
index e7400c1..94b331d 100644
--- a/docs/docs/4.布局说明/布局指引/index.html
+++ b/docs/docs/4.布局说明/布局指引/index.html
@@ -23,7 +23,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/4.布局说明/拖拽自动对齐/index.html b/docs/docs/4.布局说明/拖拽自动对齐/index.html
index c59601e..8c70c15 100644
--- a/docs/docs/4.布局说明/拖拽自动对齐/index.html
+++ b/docs/docs/4.布局说明/拖拽自动对齐/index.html
@@ -17,7 +17,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/5.参数及联动钻取/index.html b/docs/docs/5.参数及联动钻取/index.html
index 565bd99..0ae8c52 100644
--- a/docs/docs/5.参数及联动钻取/index.html
+++ b/docs/docs/5.参数及联动钻取/index.html
@@ -15,7 +15,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <link rel="alternate" type="application/rss+xml" href="https://help.smartchart.cn/docs/5.%E5%8F%82%E6%95%B0%E5%8F%8A%E8%81%94%E5%8A%A8%E9%92%BB%E5%8F%96/index.xml" title="Smartchart开发手册" />
diff --git a/docs/docs/5.参数及联动钻取/index.xml b/docs/docs/5.参数及联动钻取/index.xml
index 5c7890d..23d5bda 100644
--- a/docs/docs/5.参数及联动钻取/index.xml
+++ b/docs/docs/5.参数及联动钻取/index.xml
@@ -26,7 +26,7 @@
 常规方法 # 比如你需要点击0号图形, 指定其它图形联动 你只需要打开0号图形的数据集编辑页面, 点击标题的位置 然后输入相关的参数即可, 以下为sample 参数值设定的方法, 你可以先留空, 然后保存, F12打开浏览器调试方法 点击0号图形你需要点击的动作, 你可以在调试窗口的console看到输入的log 比如我们需要传递的参数值是&amp;quot;廉颇&amp;quot;, 那么取数据的方法就是data.name, 你把这个填入即可 这样就实现按所选数据或所选系列钻取/联动了, 重新点击当前所选, 恢复原来的
 TIPS: 在图形编辑器中, 可以使用函数 ds_param(&amp;lsquo;参数名&amp;rsquo;) 来获取传入的参数值
 高级定制方法 # 如有更多个性化需求,可在需要点击的图形的编辑器中加入以下代码,仅需修改的是序号和参数名
-//比如传入多个参数进行联动 myChart__name__.on(&amp;#39;click&amp;#39;, function(params){ let myparam = params.seriesName; //获取点击的值 ds_setParam(&amp;#39;参数名&amp;#39;, myparam); //填写你的数据集的SQL设定中对应的参数名 ds_setParam(&amp;#39;参数名2&amp;#39;, myparam2); //你可以赋值给多个参数 ds_refresh(3); //3 为你要刷新图形序号 }); //函数方法说明 ds_setParam(&amp;#39;参数名&amp;#39;, 参数值) 此方法将自动判断当参数值为空时, 删除参数回到初始未传参状态 你还可以实现钻取到另外一个报表</description>
+//比如传入多个参数进行联动 myChart__name__.on(&amp;#39;click&amp;#39;, function(params){ let myparam = params.seriesName; //获取点击的值 ds_setParam(&amp;#39;参数名&amp;#39;, myparam); //填写你的数据集的SQL设定中对应的参数名 ds_setParam(&amp;#39;参数名2&amp;#39;, myparam2); //你可以赋值给多个参数 ds_refresh(3); //3 为你要刷新图形序号 }); //函数方法说明 ds_setParam(&amp;#39;参数名&amp;#39;, 参数值) 此方法将自动判断当参数值为空,null或0时, 删除参数回到初始未传参状态 所以请注意此方法无法传递参数空,null及0, 如需传递请将0转化成字符 你还可以实现钻取到另外一个报表</description>
     </item>
     
     <item>
diff --git a/docs/docs/5.参数及联动钻取/参数编写方法/index.html b/docs/docs/5.参数及联动钻取/参数编写方法/index.html
index 463fd1b..d292fc5 100644
--- a/docs/docs/5.参数及联动钻取/参数编写方法/index.html
+++ b/docs/docs/5.参数及联动钻取/参数编写方法/index.html
@@ -19,7 +19,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/5.参数及联动钻取/图形联动钻取/index.html b/docs/docs/5.参数及联动钻取/图形联动钻取/index.html
index cef95b2..f8a0102 100644
--- a/docs/docs/5.参数及联动钻取/图形联动钻取/index.html
+++ b/docs/docs/5.参数及联动钻取/图形联动钻取/index.html
@@ -8,7 +8,7 @@
 常规方法 # 比如你需要点击0号图形, 指定其它图形联动 你只需要打开0号图形的数据集编辑页面, 点击标题的位置 然后输入相关的参数即可, 以下为sample 参数值设定的方法, 你可以先留空, 然后保存, F12打开浏览器调试方法 点击0号图形你需要点击的动作, 你可以在调试窗口的console看到输入的log 比如我们需要传递的参数值是&quot;廉颇&quot;, 那么取数据的方法就是data.name, 你把这个填入即可 这样就实现按所选数据或所选系列钻取/联动了, 重新点击当前所选, 恢复原来的
 TIPS: 在图形编辑器中, 可以使用函数 ds_param(&lsquo;参数名&rsquo;) 来获取传入的参数值
 高级定制方法 # 如有更多个性化需求,可在需要点击的图形的编辑器中加入以下代码,仅需修改的是序号和参数名
-//比如传入多个参数进行联动 myChart__name__.on(&#39;click&#39;, function(params){ let myparam = params.seriesName; //获取点击的值 ds_setParam(&#39;参数名&#39;, myparam); //填写你的数据集的SQL设定中对应的参数名 ds_setParam(&#39;参数名2&#39;, myparam2); //你可以赋值给多个参数 ds_refresh(3); //3 为你要刷新图形序号 }); //函数方法说明 ds_setParam(&#39;参数名&#39;, 参数值) 此方法将自动判断当参数值为空时, 删除参数回到初始未传参状态 你还可以实现钻取到另外一个报表">
+//比如传入多个参数进行联动 myChart__name__.on(&#39;click&#39;, function(params){ let myparam = params.seriesName; //获取点击的值 ds_setParam(&#39;参数名&#39;, myparam); //填写你的数据集的SQL设定中对应的参数名 ds_setParam(&#39;参数名2&#39;, myparam2); //你可以赋值给多个参数 ds_refresh(3); //3 为你要刷新图形序号 }); //函数方法说明 ds_setParam(&#39;参数名&#39;, 参数值) 此方法将自动判断当参数值为空,null或0时, 删除参数回到初始未传参状态 所以请注意此方法无法传递参数空,null及0, 如需传递请将0转化成字符 你还可以实现钻取到另外一个报表">
 <meta name="theme-color" content="#FFFFFF">
 <meta name="color-scheme" content="light dark"><meta property="og:title" content="" />
 <meta property="og:description" content="数据集准备 # 首先在需要进行联动的数据集中SQL的写法如下, 比如对应2号图形:
@@ -16,7 +16,7 @@ TIPS: 在图形编辑器中, 可以使用函数 ds_param(&lsquo;参数名&rsquo;
 常规方法 # 比如你需要点击0号图形, 指定其它图形联动 你只需要打开0号图形的数据集编辑页面, 点击标题的位置 然后输入相关的参数即可, 以下为sample 参数值设定的方法, 你可以先留空, 然后保存, F12打开浏览器调试方法 点击0号图形你需要点击的动作, 你可以在调试窗口的console看到输入的log 比如我们需要传递的参数值是&quot;廉颇&quot;, 那么取数据的方法就是data.name, 你把这个填入即可 这样就实现按所选数据或所选系列钻取/联动了, 重新点击当前所选, 恢复原来的
 TIPS: 在图形编辑器中, 可以使用函数 ds_param(&lsquo;参数名&rsquo;) 来获取传入的参数值
 高级定制方法 # 如有更多个性化需求,可在需要点击的图形的编辑器中加入以下代码,仅需修改的是序号和参数名
-//比如传入多个参数进行联动 myChart__name__.on(&#39;click&#39;, function(params){ let myparam = params.seriesName; //获取点击的值 ds_setParam(&#39;参数名&#39;, myparam); //填写你的数据集的SQL设定中对应的参数名 ds_setParam(&#39;参数名2&#39;, myparam2); //你可以赋值给多个参数 ds_refresh(3); //3 为你要刷新图形序号 }); //函数方法说明 ds_setParam(&#39;参数名&#39;, 参数值) 此方法将自动判断当参数值为空时, 删除参数回到初始未传参状态 你还可以实现钻取到另外一个报表" />
+//比如传入多个参数进行联动 myChart__name__.on(&#39;click&#39;, function(params){ let myparam = params.seriesName; //获取点击的值 ds_setParam(&#39;参数名&#39;, myparam); //填写你的数据集的SQL设定中对应的参数名 ds_setParam(&#39;参数名2&#39;, myparam2); //你可以赋值给多个参数 ds_refresh(3); //3 为你要刷新图形序号 }); //函数方法说明 ds_setParam(&#39;参数名&#39;, 参数值) 此方法将自动判断当参数值为空,null或0时, 删除参数回到初始未传参状态 所以请注意此方法无法传递参数空,null及0, 如需传递请将0转化成字符 你还可以实现钻取到另外一个报表" />
 <meta property="og:type" content="article" />
 <meta property="og:url" content="https://help.smartchart.cn/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/" /><meta property="article:section" content="docs" />
 
@@ -27,7 +27,7 @@ TIPS: 在图形编辑器中, 可以使用函数 ds_param(&lsquo;参数名&rsquo;
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
@@ -1669,7 +1669,8 @@ select xxx,xxx,xxx from tablename /* where xxxx = &#39;$参数名&#39; */ ....
 </span></span></span><span style="display:flex;"><span><span style="color:#75715e"></span>});
 </span></span></code></pre></div><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-javascript" data-lang="javascript"><span style="display:flex;"><span><span style="color:#75715e">//函数方法说明
 </span></span></span><span style="display:flex;"><span><span style="color:#75715e"></span><span style="color:#a6e22e">ds_setParam</span>(<span style="color:#e6db74">&#39;参数名&#39;</span>, <span style="color:#a6e22e">参数值</span>)
-</span></span><span style="display:flex;"><span><span style="color:#a6e22e">此方法将自动判断当参数值为空时</span>, <span style="color:#a6e22e">删除参数回到初始未传参状态</span>
+</span></span><span style="display:flex;"><span><span style="color:#a6e22e">此方法将自动判断当参数值为空</span>,<span style="color:#a6e22e">null或0时</span>, <span style="color:#a6e22e">删除参数回到初始未传参状态</span>
+</span></span><span style="display:flex;"><span><span style="color:#a6e22e">所以请注意此方法无法传递参数空</span>,<span style="color:#a6e22e">null及0</span>, <span style="color:#a6e22e">如需传递请将0转化成字符</span>
 </span></span></code></pre></div><p>你还可以实现钻取到另外一个报表</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-js" data-lang="js"><span style="display:flex;"><span><span style="color:#a6e22e">myChart__name__</span>.<span style="color:#a6e22e">on</span>(<span style="color:#e6db74">&#39;click&#39;</span>, <span style="color:#66d9ef">function</span> (<span style="color:#a6e22e">params</span>) {
 </span></span><span style="display:flex;"><span> <span style="color:#66d9ef">let</span> <span style="color:#a6e22e">myparam</span> <span style="color:#f92672">=</span> <span style="color:#e6db74">`&amp;param={&#34;参数名&#34;: &#34;</span><span style="color:#e6db74">${</span><span style="color:#a6e22e">params</span>.<span style="color:#a6e22e">seriesName</span><span style="color:#e6db74">}</span><span style="color:#e6db74">&#34;}`</span>;
diff --git a/docs/docs/5.参数及联动钻取/筛选器指南/index.html b/docs/docs/5.参数及联动钻取/筛选器指南/index.html
index 8713c80..ad53241 100644
--- a/docs/docs/5.参数及联动钻取/筛选器指南/index.html
+++ b/docs/docs/5.参数及联动钻取/筛选器指南/index.html
@@ -29,7 +29,7 @@ select xx, xx, xx from tablename /* where xx = &#39;$pcity&#39; */ 现在回到
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/5.参数及联动钻取/组件自定义联动/index.html b/docs/docs/5.参数及联动钻取/组件自定义联动/index.html
index 4b40d35..4f2ec55 100644
--- a/docs/docs/5.参数及联动钻取/组件自定义联动/index.html
+++ b/docs/docs/5.参数及联动钻取/组件自定义联动/index.html
@@ -25,7 +25,7 @@ select distinct H1 as heroname from smartdemo2 limit 10 第三步，编辑此数
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/6.进阶开发PRO/index.html b/docs/docs/6.进阶开发PRO/index.html
index 306d0aa..8e2ccae 100644
--- a/docs/docs/6.进阶开发PRO/index.html
+++ b/docs/docs/6.进阶开发PRO/index.html
@@ -15,7 +15,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <link rel="alternate" type="application/rss+xml" href="https://help.smartchart.cn/docs/6.%E8%BF%9B%E9%98%B6%E5%BC%80%E5%8F%91PRO/index.xml" title="Smartchart开发手册" />
diff --git a/docs/docs/6.进阶开发PRO/低代码开发/IDE开发模式/index.html b/docs/docs/6.进阶开发PRO/低代码开发/IDE开发模式/index.html
index f13d112..b657315 100644
--- a/docs/docs/6.进阶开发PRO/低代码开发/IDE开发模式/index.html
+++ b/docs/docs/6.进阶开发PRO/低代码开发/IDE开发模式/index.html
@@ -25,7 +25,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/6.进阶开发PRO/低代码开发/index.html b/docs/docs/6.进阶开发PRO/低代码开发/index.html
index 9da60ab..62d7d9a 100644
--- a/docs/docs/6.进阶开发PRO/低代码开发/index.html
+++ b/docs/docs/6.进阶开发PRO/低代码开发/index.html
@@ -15,7 +15,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <link rel="alternate" type="application/rss+xml" href="https://help.smartchart.cn/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/index.xml" title="Smartchart开发手册" />
diff --git a/docs/docs/6.进阶开发PRO/低代码开发/上传资源文件/index.html b/docs/docs/6.进阶开发PRO/低代码开发/上传资源文件/index.html
index 016b221..3db9bc4 100644
--- a/docs/docs/6.进阶开发PRO/低代码开发/上传资源文件/index.html
+++ b/docs/docs/6.进阶开发PRO/低代码开发/上传资源文件/index.html
@@ -21,7 +21,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/6.进阶开发PRO/低代码开发/动画效果/index.html b/docs/docs/6.进阶开发PRO/低代码开发/动画效果/index.html
index 741fc99..d126bdc 100644
--- a/docs/docs/6.进阶开发PRO/低代码开发/动画效果/index.html
+++ b/docs/docs/6.进阶开发PRO/低代码开发/动画效果/index.html
@@ -23,7 +23,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/6.进阶开发PRO/低代码开发/快捷开发/index.html b/docs/docs/6.进阶开发PRO/低代码开发/快捷开发/index.html
index 62de869..3d0c379 100644
--- a/docs/docs/6.进阶开发PRO/低代码开发/快捷开发/index.html
+++ b/docs/docs/6.进阶开发PRO/低代码开发/快捷开发/index.html
@@ -21,7 +21,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/6.进阶开发PRO/低代码开发/样式快速上手/index.html b/docs/docs/6.进阶开发PRO/低代码开发/样式快速上手/index.html
index 50827aa..f24f5bf 100644
--- a/docs/docs/6.进阶开发PRO/低代码开发/样式快速上手/index.html
+++ b/docs/docs/6.进阶开发PRO/低代码开发/样式快速上手/index.html
@@ -35,7 +35,7 @@ CSS的几种引入方式 行内样式 行内式是在标记的style属性中设
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/6.进阶开发PRO/低代码开发/模板开发界面/index.html b/docs/docs/6.进阶开发PRO/低代码开发/模板开发界面/index.html
index 34b6096..be25f6b 100644
--- a/docs/docs/6.进阶开发PRO/低代码开发/模板开发界面/index.html
+++ b/docs/docs/6.进阶开发PRO/低代码开发/模板开发界面/index.html
@@ -19,7 +19,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/6.进阶开发PRO/低代码开发/编辑器快捷键/index.html b/docs/docs/6.进阶开发PRO/低代码开发/编辑器快捷键/index.html
index 9e1118c..3cc9614 100644
--- a/docs/docs/6.进阶开发PRO/低代码开发/编辑器快捷键/index.html
+++ b/docs/docs/6.进阶开发PRO/低代码开发/编辑器快捷键/index.html
@@ -17,7 +17,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/6.进阶开发PRO/低代码开发/边框与装饰/index.html b/docs/docs/6.进阶开发PRO/低代码开发/边框与装饰/index.html
index e34c4d2..a025c72 100644
--- a/docs/docs/6.进阶开发PRO/低代码开发/边框与装饰/index.html
+++ b/docs/docs/6.进阶开发PRO/低代码开发/边框与装饰/index.html
@@ -19,7 +19,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/6.进阶开发PRO/备份恢复及版本/index.html b/docs/docs/6.进阶开发PRO/备份恢复及版本/index.html
index 274ce50..10942d1 100644
--- a/docs/docs/6.进阶开发PRO/备份恢复及版本/index.html
+++ b/docs/docs/6.进阶开发PRO/备份恢复及版本/index.html
@@ -29,7 +29,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/6.进阶开发PRO/实战大屏模板转化/index.html b/docs/docs/6.进阶开发PRO/实战大屏模板转化/index.html
index c3ca292..999add5 100644
--- a/docs/docs/6.进阶开发PRO/实战大屏模板转化/index.html
+++ b/docs/docs/6.进阶开发PRO/实战大屏模板转化/index.html
@@ -17,7 +17,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/6.进阶开发PRO/数据服务/index.html b/docs/docs/6.进阶开发PRO/数据服务/index.html
index 9e9609a..52cff2e 100644
--- a/docs/docs/6.进阶开发PRO/数据服务/index.html
+++ b/docs/docs/6.进阶开发PRO/数据服务/index.html
@@ -15,7 +15,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <link rel="alternate" type="application/rss+xml" href="https://help.smartchart.cn/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/index.xml" title="Smartchart开发手册" />
diff --git a/docs/docs/6.进阶开发PRO/数据服务/后台API刷新/index.html b/docs/docs/6.进阶开发PRO/数据服务/后台API刷新/index.html
index a2a82e1..0ba50b3 100644
--- a/docs/docs/6.进阶开发PRO/数据服务/后台API刷新/index.html
+++ b/docs/docs/6.进阶开发PRO/数据服务/后台API刷新/index.html
@@ -31,7 +31,7 @@ curl -k --insecure &#34;https://www.baidu.com” 修改为可执行文件 chmod
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/6.进阶开发PRO/数据服务/数据下载/index.html b/docs/docs/6.进阶开发PRO/数据服务/数据下载/index.html
index 4da20bc..55db606 100644
--- a/docs/docs/6.进阶开发PRO/数据服务/数据下载/index.html
+++ b/docs/docs/6.进阶开发PRO/数据服务/数据下载/index.html
@@ -23,7 +23,7 @@ $(&#39;#id_down1&#39;).click(()=&gt;{ ds_download(&#39;报表数据.csv&#39;, da
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/6.进阶开发PRO/数据服务/数据填报/index.html b/docs/docs/6.进阶开发PRO/数据服务/数据填报/index.html
index 62845b7..b6c3dd6 100644
--- a/docs/docs/6.进阶开发PRO/数据服务/数据填报/index.html
+++ b/docs/docs/6.进阶开发PRO/数据服务/数据填报/index.html
@@ -19,7 +19,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/6.进阶开发PRO/数据服务/数据服务API/index.html b/docs/docs/6.进阶开发PRO/数据服务/数据服务API/index.html
index 9336982..fed7928 100644
--- a/docs/docs/6.进阶开发PRO/数据服务/数据服务API/index.html
+++ b/docs/docs/6.进阶开发PRO/数据服务/数据服务API/index.html
@@ -21,7 +21,7 @@ GET 请求 # #接口请求格式: url= &#39;/echart/dataset_api/?visitor=xxx&amp
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/6.进阶开发PRO/自定义首页/index.html b/docs/docs/6.进阶开发PRO/自定义首页/index.html
index 40177b4..cd4f494 100644
--- a/docs/docs/6.进阶开发PRO/自定义首页/index.html
+++ b/docs/docs/6.进阶开发PRO/自定义首页/index.html
@@ -17,7 +17,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/7.报表嵌入/index.html b/docs/docs/7.报表嵌入/index.html
index 5c69bf9..fd6cef3 100644
--- a/docs/docs/7.报表嵌入/index.html
+++ b/docs/docs/7.报表嵌入/index.html
@@ -15,7 +15,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <link rel="alternate" type="application/rss+xml" href="https://help.smartchart.cn/docs/7.%E6%8A%A5%E8%A1%A8%E5%B5%8C%E5%85%A5/index.xml" title="Smartchart开发手册" />
diff --git a/docs/docs/7.报表嵌入/单点登录/index.html b/docs/docs/7.报表嵌入/单点登录/index.html
index b7c6e7e..7f831ff 100644
--- a/docs/docs/7.报表嵌入/单点登录/index.html
+++ b/docs/docs/7.报表嵌入/单点登录/index.html
@@ -17,7 +17,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/7.报表嵌入/单页面嵌入/index.html b/docs/docs/7.报表嵌入/单页面嵌入/index.html
index e73d871..dc7e60d 100644
--- a/docs/docs/7.报表嵌入/单页面嵌入/index.html
+++ b/docs/docs/7.报表嵌入/单页面嵌入/index.html
@@ -25,7 +25,7 @@ import time import hashlib import os SMART_CHART_URL = &#39;http://127.0.0.1:800
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/7.报表嵌入/简单嵌入/index.html b/docs/docs/7.报表嵌入/简单嵌入/index.html
index ebb5355..7bf869a 100644
--- a/docs/docs/7.报表嵌入/简单嵌入/index.html
+++ b/docs/docs/7.报表嵌入/简单嵌入/index.html
@@ -21,7 +21,7 @@ http://localhost:8000/echart?type=仪表盘名称 如：http://localhost:8000/ec
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/8.Django应用/FAQ/index.html b/docs/docs/8.Django应用/FAQ/index.html
index 2dfdc81..403a518 100644
--- a/docs/docs/8.Django应用/FAQ/index.html
+++ b/docs/docs/8.Django应用/FAQ/index.html
@@ -21,7 +21,7 @@ python3 manage.py collectstatic " />
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/8.Django应用/index.html b/docs/docs/8.Django应用/index.html
index ba82110..45fa996 100644
--- a/docs/docs/8.Django应用/index.html
+++ b/docs/docs/8.Django应用/index.html
@@ -15,7 +15,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <link rel="alternate" type="application/rss+xml" href="https://help.smartchart.cn/docs/8.Django%E5%BA%94%E7%94%A8/index.xml" title="Smartchart开发手册" />
diff --git a/docs/docs/8.Django应用/嵌入Django-Apps/index.html b/docs/docs/8.Django应用/嵌入Django-Apps/index.html
index 4ba7e7d..ca3ba82 100644
--- a/docs/docs/8.Django应用/嵌入Django-Apps/index.html
+++ b/docs/docs/8.Django应用/嵌入Django-Apps/index.html
@@ -23,7 +23,7 @@ TEMPLATES = [ { &#39;BACKEND&#39;: &#39;django.template.backends.django.DjangoTe
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/9.Jupyter应用/Jupyter中使用指引/index.html b/docs/docs/9.Jupyter应用/Jupyter中使用指引/index.html
index 19bcdb7..1875a97 100644
--- a/docs/docs/9.Jupyter应用/Jupyter中使用指引/index.html
+++ b/docs/docs/9.Jupyter应用/Jupyter中使用指引/index.html
@@ -29,7 +29,7 @@ from smart_chart import Smart Smart().set_auth(&#39;用户名&#39;, &#39;密码&
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/9.Jupyter应用/index.html b/docs/docs/9.Jupyter应用/index.html
index 8afef1b..180fbce 100644
--- a/docs/docs/9.Jupyter应用/index.html
+++ b/docs/docs/9.Jupyter应用/index.html
@@ -15,7 +15,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <link rel="alternate" type="application/rss+xml" href="https://help.smartchart.cn/docs/9.Jupyter%E5%BA%94%E7%94%A8/index.xml" title="Smartchart开发手册" />
diff --git a/docs/docs/index.html b/docs/docs/index.html
index dd155e9..ad0f422 100644
--- a/docs/docs/index.html
+++ b/docs/docs/index.html
@@ -15,7 +15,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <link rel="alternate" type="application/rss+xml" href="https://help.smartchart.cn/docs/index.xml" title="Smartchart开发手册" />
diff --git a/docs/docs/关于我们/index.html b/docs/docs/关于我们/index.html
index 8aa6e66..8ec423e 100644
--- a/docs/docs/关于我们/index.html
+++ b/docs/docs/关于我们/index.html
@@ -23,7 +23,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/docs/设计理念/index.html b/docs/docs/设计理念/index.html
index eed9523..e5b09ec 100644
--- a/docs/docs/设计理念/index.html
+++ b/docs/docs/设计理念/index.html
@@ -19,7 +19,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <!--
diff --git a/docs/en.search-data.min.3cafa0b94e37157671ea76c2a8be4e6acaccc22ec5373b70cf48ca13d81d32ca.json b/docs/en.search-data.min.3cafa0b94e37157671ea76c2a8be4e6acaccc22ec5373b70cf48ca13d81d32ca.json
new file mode 100644
index 0000000..28eef36
--- /dev/null
+++ b/docs/en.search-data.min.3cafa0b94e37157671ea76c2a8be4e6acaccc22ec5373b70cf48ca13d81d32ca.json
@@ -0,0 +1 @@
+[{"id":0,"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/","title":"使用 Vue","section":"Vue相关","content":" 使用场景 # 报表中涉及交互场景较多, 需要数据与页面绑定 开发者熟悉vue 常见绑定 # //显示变量message \u0026lt;p\u0026gt;{[ message ]}\u0026lt;/p\u0026gt; //循环产生li,变量sites \u0026lt;ol\u0026gt; \u0026lt;li v-for=\u0026#34;site in sites\u0026#34;\u0026gt; {[ site.name ]} \u0026lt;/li\u0026gt; \u0026lt;/ol\u0026gt; //绑定输入值变量use \u0026lt;input type=\u0026#34;checkbox\u0026#34; v-model=\u0026#34;use\u0026#34;\u0026gt; //显示控制 \u0026lt;p v-if=\u0026#34;seen\u0026#34;\u0026gt;现在你看到我了\u0026lt;/p\u0026gt; \u0026lt;p v-show=\u0026#34;seen\u0026#34;\u0026gt;现在你看到我了\u0026lt;/p\u0026gt; //绑定属性 \u0026lt;a :href=\u0026#34;url\u0026#34;\u0026gt;\u0026lt;/a\u0026gt; \u0026lt;div :style=\u0026#34;{ color: activeColor, fontSize: fontSize + \u0026#39;px\u0026#39; }\u0026#34;\u0026gt;\u0026lt;/div\u0026gt; \u0026lt;div :class=\u0026#34;[errorClass ,isActive ? activeClass : \u0026#39;\u0026#39;]\u0026#34;\u0026gt;\u0026lt;/div\u0026gt; //绑定点击方法 \u0026lt;a @click=\u0026#34;doSomething\u0026#34;\u0026gt;\u0026lt;/a\u0026gt; 开启VUE # 需要在设定\u0026ndash;\u0026gt;高级设定中可开启vue模式\n简单赋值应用 # 系统默认为初始vue及内置vue的data有17个变量(从d0, d1\u0026hellip; d16) 你可以在图形编辑器中给vue的变量赋值, 赋值方式:\nvapp.d0 = xxxx 你可以将d0赋值为字典, 如:\nvapp.d0 = { \u0026#39;index1\u0026#39;: 100, \u0026#39;index2\u0026#39;: 300} 注意,我们修改了vue在模板中变量的默认引用方式, 你需要采用如下方法引用: {[d0.index1]}\n使用模板可以更方便使用VUE # 你也可以在 模板开发中 使用VUE 开启方法, 首先你需要在高级设定中开启模板功能, 然后你可以看到 模板 的菜单, 进入编辑器\n如果你需要更多自定义的方法, 例如加入方法, 你可以在模板的script中加入自定义代码\n\u0026lt;script\u0026gt; var vapp = new Vue({el: \u0026#39;#vue_app\u0026#39;, delimiters: [\u0026#39;{[\u0026#39;, \u0026#39;]}\u0026#39;], data: { tableData:\u0026#39;\u0026#39; }, methods: { formatter(row, column) { return row.address; } } }); \u0026lt;/script\u0026gt; "},{"id":1,"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/","title":"主题应用 Pro","section":"不太重要","content":"点击smartchart图标,切换到菜单固定模式, 你可看到主题的选择 "},{"id":2,"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/","title":"快速开始","section":"Linux","content":" 涉及的基础环境和版本： # * Centos 7 * Python 3.9 /data/smartchart/ 项目主目录 /data/smartchart/tools 项目相关软件 下述内容中，凡是涉及到/data/smartchart路径的，都可以将其修改为你自己系统上的路径。 安装环境 # 安装Python # cd /data/smartchart/tools yum -y install zlib-devel bzip2-devel openssl-devel ncurses-devel sqlite-devel readline-devel tk-devel gdbm-devel db4-devel libpcap-devel xz-devel libffi-devel 下载https://npm.taobao.org/mirrors/python/3.9.0/ 上传服务器，放入安装目录解压 或者 Wget https://npm.taobao.org/mirrors/python/3.9.0/Python-3.9.0.tgz tar -zxvf Python-3.9.0.tgz 进行源码目录 配置安装路径 ./Python-3.9.0/configure --prefix=/data/smartchart/tools/python3 编译安装 make \u0026amp;\u0026amp; make install 建立软链接 ln -s /data/smartchart/tools/python3/bin/python3.9 /usr/bin/python3 ln -s /data/smartchart/tools/python3/bin/pip3.9 /usr/bin/pip3 测试是否安装成功 python3 --version 建立python虚拟环境 # python3 -m venv myvenv cd myvenv source bin/activate 在虚拟环境中安装smartchart # pip3 install -i https://pypi.tuna.tsinghua.edu.cn/simple smartchart -U 启动smartchart(测试部署), 企业部署方式可有尝咨询 # smartchart runserver 0.0.0.0:8000 --insecure --noreload "},{"id":3,"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/","title":"数据集开发界面","section":"2.数据集说明","content":"开发前建意先观看视屏, 了解基础说明, 视屏有点老和现在界面不一样, 目前很多功能已经做成可视化配置, 理解过程即可, 具体以文档为准\nSmartchart数据集与图形 从仪表盘界面中进入简易开发界面 # "},{"id":4,"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/","title":"Api数据集","section":"特殊数据源","content":" API接口要求 # 接口返回一定要是JSON格式\n数据源配置方法 # 你可选择任意数据连接\n使用方法 # 以下是简单的get及post方法样列\n//GET 方法: dataset= { \u0026#34;url\u0026#34;:\u0026#34;https://www.smartchart.cn/smartdata/api/?i=loaddataset1\u0026amp;j=1\u0026#34; } //POST 方法: dataset= { \u0026#34;url\u0026#34;:\u0026#34;https://www.smartchart.cn/smartdata/api\u0026#34;, \u0026#34;method\u0026#34;:\u0026#34;POST\u0026#34;, \u0026#34;data\u0026#34;:{\u0026#34;i\u0026#34;:\u0026#34;loaddataset1\u0026#34;, \u0026#34;j\u0026#34;:\u0026#34;1\u0026#34;} ... } 可以传入参数做出联动效果\ndataset= { \u0026#34;url\u0026#34;:\u0026#34;https://www.smartchart.cn/smartdata/api\u0026#34;, \u0026#34;method\u0026#34;:\u0026#34;POST\u0026#34;, \u0026#34;data\u0026#34;:{\u0026#34;i\u0026#34;:\u0026#34;loaddataset1\u0026#34;, \u0026#34;j\u0026#34;:\u0026#34;/*$参数名*/\u0026#34;} ... } 可以增加header等认证方式\ndataset= { \u0026#34;url\u0026#34;:\u0026#34;https://www.smartchart.cn/smartdata/api\u0026#34;, \u0026#34;method\u0026#34;:\u0026#34;GET\u0026#34;, \u0026#34;headers\u0026#34;:{\u0026#34;Cookie\u0026#34;:\u0026#34;xxxxxxx\u0026#34;} ... } "},{"id":5,"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/","title":"使用 Excel数据","section":"特殊数据源","content":" 使用固定数据集 # 有一些场景, 比如已有一些固定的筛选器,或是需要测试用,或者Demo,或者其它图形需要用到一些共用的已确定好的数据 这样我们可以不需要通过查询数据库的方式, 而直接写入数据集, 支持数组和字典的格式 你只需要在数据集中起始写入 dataset= , 这样就是默认是固定数据\n如何快速的输入固定数据集, 你可以通过直接从EXCEL复制到数据集编辑器(以下图片非目前编辑器, 供参考),保存以后会自动生成: 固定数据集也支持之前提到传参数, 魔术方法, 缓存等所有数据集的功能 上传文件的方式使用 # 用户如何上传文件 # smartchart默认是不自带文件上传功能 但是smartchart是可以自已创造上传页面, 在模板商店中你可以找到相关模板进行购买 然后通过模板下载的方式下载后进行操作 这样每一个页面是可以单独使用权限控制的,就和控制报表权限一样,你还可能按需随意定制页面\n关于上传文件的路径 # 默认的上传主目录是在项目的log的文件夹下面, 你可以在setting.py(自定义django) 或 config.ini中设定UPLOAD_PATH来修改你的上传目录 比如你上传页面的报表ID是23, 那么文件将会被上传到UPLOAD_PATH/23/你的文件名\n如何使用上传的文件 # 你需要使用 python连接器, 来操作你的上传的数据, 内置了变量ds_path为你的上传目录, 所以可以更方便的读取上传的文件,如上文件 df = pd.read_excel(ds_path+\u0026rsquo;/23/文件名')\n"},{"id":6,"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/","title":"图形端数据函数","section":"函数方法","content":" 应用场景 # 在图形开发中，我们可能需要使用js对传递过来的数据进行处理\n原始数据格式 # 假设dataset的格式是, SQL = Select 维度1,维度2,数据 from xxxx, 生成的数据集如下\ndataset = [[\u0026#39;category\u0026#39;,\u0026#39;C1\u0026#39;,\u0026#39;C2\u0026#39;], [\u0026#39;R1\u0026#39;, 12, 18], [\u0026#39;R2\u0026#39;, 10, 17] ] 常用转化函数 # 生成字典表示为key-\u0026gt;[], 常用于定制化高的图形 # result = ds_createMap(dataset) 结果 = {\u0026#34;category\u0026#34;:[\u0026#39;C1\u0026#39;,\u0026#39;C2\u0026#39;], \u0026#34;R1\u0026#34; : [12, 10], \u0026#34;R2\u0026#34; : [18, 17]} 生成非常多前端组件要求的格式 # result = ds_createMap_all(dataset) 结果 = [{\u0026#34;category\u0026#34;:\u0026#34;R1\u0026#34;, \u0026#34;C1\u0026#34;: 12, \u0026#34;C2\u0026#34;: 18}, {\u0026#34;category\u0026#34;:\u0026#34;R2\u0026#34;, \u0026#34;C1\u0026#34;: 10, \u0026#34;C2\u0026#34;: 17}] 获取列名list, 用于获取系列名 # result = ds_rowname(dataset) 结果 = [\u0026#39;R1\u0026#39;,\u0026#39;R2\u0026#39;] 将数据集行列转化, 一般用于坐标轴翻转 # result = ds_transform(dataset) 结果 = [[\u0026#39;category\u0026#39;,\u0026#39;R1\u0026#39;,\u0026#39;R2\u0026#39;], [\u0026#39;C1\u0026#39;, 12, 10], [\u0026#39;C2\u0026#39;, 18, 17]] 两个数据集左关联, 常用于将两段查询数据合并 # //假设需要关联的数据集格式： dataset2 = [[\u0026#39;category\u0026#39;,\u0026#39;C3\u0026#39;], [\u0026#39;R1\u0026#39;, 38], [\u0026#39;R6\u0026#39;, 13]] //处理后的结果： result = ds_leftjoin(dataset, dataset2) 结果 = [[\u0026#39;category\u0026#39;,\u0026#39;C1\u0026#39;,\u0026#39;C2\u0026#39;,\u0026#39;C3\u0026#39;], [\u0026#39;R1\u0026#39;, 12, 18, 38], [\u0026#39;R2\u0026#39;, 10, 17, 0] ] 数据集旋转，在excel中叫透视表 # //比如需要将dataset3的户型变成指标 dataset3 = [[\u0026#39;城市\u0026#39;,\u0026#39;户型\u0026#39;,\u0026#39;数量\u0026#39;], [\u0026#39;长沙\u0026#39;,\u0026#39;A\u0026#39;,35], [\u0026#39;上海\u0026#39;,\u0026#39;B\u0026#39;,19]] //处理后的结果： result = ds_pivot(dataset3) 结果 = [[\u0026#34;城市\u0026#34;,\u0026#34;A\u0026#34;,\u0026#34;B\u0026#34;], [\u0026#34;长沙\u0026#34;,35,0], [\u0026#34;上海\u0026#34;,0,19]] 移除数据集中的某几列 # //比如移除第1列（序号0） result=ds_remove_column(dataset,remove_list=[0]) 结果 = [[\u0026#39;R1\u0026#39;,\u0026#39;R2\u0026#39;], [12, 10], [18, 17] ] 图形中可用转化函数 # 函数名 函数说明 样列 ds_transform(dataset) 行列替换 ds_split(data,sep=\u0026rsquo;,\u0026rsquo;,head_add=[]) 将第一列拆分成多个字段,默认逗号分隔, 如果不传表头,取SQL中的字段名拆分 ds_createMap(data) data表示传入的二位数组,生成结果表示为key-\u0026gt;[], 常用于echarts指定数据 ds_createMap_all(data) data表示传入的二维数组,生成结果表示为[{A:A1,B:B1,C:C1},{A:A2,B:B2,C:C2}\u0026hellip;] ds_mapToList(data) 将createMap_all的格式还原成二维数组, 常用于将nosql(mongodb,es..)数据源数据处理 ds_rowname(dataset,start_row=1,column=0) 获取指定列的数据, 默认取第一列从第二行(序号1)开始的数据,常用于获取维度 ds_remove_column(dataset,remove_list=[0]) 默认移除第一列, 也要移除指定的多个列 ds_toThousands(num) 转逗号分隔的千分位 ds_distinct(a, b=[]) 对单个或多个二维数组去重 ds_leftjoin(a,b,withhead=true,type=1) 两个数组join [[1,2,3,4],[2,3,4,5]] ,[[2,3,4]], 如果带头,合并头 ds_crossjoin(a,b,withhead=true) ds_fulljoin(a,b,withhead=true) ds_union(a,b,withhead=true) 合并两个数据集, 可选是否带头, 取第一个数据集的头, 去除第二个头 ds_pivot(arr) 传入二维数组(维度, 维度, 值), 将第二列的维度转为列 ds_sort(arr, index=0, asc=true) 指定二维数组列序号排序,默认升序,index参数也可以是函数,如(a,b)=\u0026gt;{return a.qty - b.qty} ds_round(num,qty=2) 小数点处理, 默认保留两位小数 ds_param(name) 传入参数名,获取图形点击时传递来的参数值 ds_setParam(\u0026lsquo;参数名\u0026rsquo;, 参数值) 设定全局参数, 此方法将自动判断当参数值为空时, 删除参数回到初始未传参状态 ds_refresh(id, param=filter_param) 刷新图形, id为图形序号,默认采取全局参数刷新,也可指定param,参数为字典{\u0026ldquo;参数名\u0026rdquo;:\u0026ldquo;值\u0026rdquo;,\u0026hellip;} ds_excel_refresh(dataset) 刷新复杂报表, dataset格式:{df0:二维数组, df1:二维数组,..} ds_excel_value(fillCells,clear=false) 指定单元格获取复杂报表中的数据, fillcells格式:[\u0026lsquo;A1\u0026rsquo;,\u0026lsquo;B2\u0026rsquo;],一般用于数据填报 常用JS原生函数 # //数组追加 dataset.push(item) //数组前方插入 dataset.unshit(item) //切片 dataset = dataset.slice(1) 从序号1个开始到最最后一个 dataset = dataset.slice(5, 10) 从第序号5开始截取到第10个 dataset = dataset.slice(-3) 截取最后三个元素 //循环遍历 //for最快，但可读性比较差(smartchart推荐) //forEach比较快，能够控制内容 //for...in比较慢，不方便 for(let i=0; i\u0026lt;dataset.length; i++){ } 其它方法 # 多维度的数据透视 # 常规数据集中提到 A类数据源的情况, 格式都是: 维度A 维度B 数据 但还有情况比如你有一个数据格式是: 维度A 维度B 维度C 数据 你需要在表格中将 A,B维度做维度, 但C做透视为指标名进行展示 由于我们的数据透视只支持\u0026#34;字符, 字符, 数值\u0026#34;的SQL写法, 所以如果要多维, 我们需要做下转变, 可以写成: select concat_ws(\u0026#39;,\u0026#39;,维度A,维度B) AS 维度,维度C,SUM(数据) AS 度量 from tablename group by 维度, 维度C 得到的数据样式 dataset=[[\u0026#39;维度\u0026#39;,\u0026#39;C1\u0026#39;,\u0026#39;C2\u0026#39;....] ,[\u0026#39;A1,B1\u0026#39;,1,1...] ,[\u0026#39;A2,B2\u0026#39;,2,2...]] 最终在图形数据集处理中, 我们可以使用如下函数进行转化: dataset = ds_split(dataset,\u0026#39;,\u0026#39;,[\u0026#39;维度A\u0026#39;,\u0026#39;维度B\u0026#39;]) \u0026#39;,\u0026#39; : 参数为分隔符 [\u0026#39;维度A\u0026#39;,\u0026#39;维度B\u0026#39;] : 指第一个字段需要拆分的表头名称 最终得到的数据就是多维度透视 [[\u0026#39;维度A\u0026#39;,\u0026#39;维度B\u0026#39;,\u0026#39;C1\u0026#39;,\u0026#39;C2\u0026#39;....] ,[\u0026#39;A1\u0026#39;,\u0026#39;B1\u0026#39;,1,1...] ,[\u0026#39;A2\u0026#39;,\u0026#39;B2\u0026#39;,2,2...]] "},{"id":7,"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/","title":"基础图形","section":"3.图形开发","content":" 快速应用基础图形组件 # 你可使用如下方式选择\u0026quot;图形\u0026quot;\u0026ndash;\u0026gt;\u0026ldquo;基础图形\u0026rdquo; 点击即可一键进行应用 可以在图形商店中找到更多已转化好的Smartchart图形 我们只放了基础图形,因为你可以通过简单修改配置转化为各种图形,如线性面积图, 柱形堆叠图.. 理解ECharts基础概念 # 只需要围绕option进行定制设定。echarts使用 option 来描述其对图表的各种需求，包括：有什么数据、要画什么图表、图表长什么样子、含有什么组件、组件能操作什么事情等等。简而言之，option 表述了：数据、数据如何映射成图形、交互行为。\n系列（series） # 组件（component） # 在系列之上，echarts 中各种内容，被抽象为“组件”。例如，echarts 中至少有这些组件：xAxis（直角坐标系 X 轴）、yAxis（直角坐标系 Y 轴）、grid（直角坐标系底板）、angleAxis（极坐标系角度轴）、radiusAxis（极坐标系半径轴）、polar（极坐标系底板）、geo（地理坐标系）、dataZoom（数据区缩放组件）、visualMap（视觉映射组件）、tooltip（提示框组件）、toolbox（工具栏组件）、series（系列）、\u0026hellip; 组件的定位 # 多数组件和系列，都能够基于top / right / down / left / width / height 绝对定位(坐标基于echarts容器)。\n其中，他们每个值都可以是： 绝对数值（例如 bottom: 54 表示：距离 echarts 容器底边界 54 像素）。 或者基于 echarts 容器高宽的百分比（例如 right: \u0026lsquo;20%\u0026rsquo; 表示：距离 echarts 容器右边界的距离是 echarts 容器宽度的 20%）。 如下图的例子，对 grid 组件（也就是直角坐标系的底板）设置 left、right、height、bottom 达到的效果。 坐标系 # 如下图, 不同系列映射到不同的坐标系 快速应用配置项 # 在您理解了echarts的配置方法后,你可以在\u0026quot;参考\u0026quot;的菜单中找到对应的常用参考项 Echarts的配置项目非常多, 如果需要更多配置, 您可以参考 速查手册\n注意事项 # 对于一些特殊图形,如地图, 在图形编辑中,需要进行动态加载 你可在图形编辑器使用ds_loadjs(\u0026lsquo;smt_china’)加载中国地图 同理我们有 \u0026lsquo;smt_wordcloud\u0026rsquo;, \u0026lsquo;smt_world\u0026rsquo;, \u0026lsquo;smt_ecStat\u0026rsquo;, ‘smt_liquidfill’ 有些图形可能同时需要在模板中加载, 更多特殊图形加载说明参考 特殊图形模板加载 "},{"id":8,"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/","title":"布局指引","section":"4.布局说明","content":" SmartChart布局说明 # 推荐先观看视屏了解 smartchart布局方式\n容器说明 # 容器 说明 定位容器 用于图形定位, 有拖拽和栅格两种. 在界面上新增时会自带;在模板编辑中新增图形时需自行加入容器 图形容器 用于图形选择, 使用id选择器, 如序号为2的容器, 选择器为#container_2 图形 可视化的实际单位, 如选择图形中的table标签, 可使用#container_2 table 6.0版本中拖拽布局方式已可同时满足电脑端/移动端的需求\n响应式布局 # 当你新增一个栅格图形时, smartchart会给你一段默认的代码\n\u0026lt;div class=\u0026#34;el-col-xs-24 el-col-md-24\u0026#34; style=\u0026#34;padding:0.2rem;height:50%;\u0026#34; \u0026gt; \u0026lt;div style=\u0026#34;height:100%;\u0026#34; id=\u0026#34;container_{name}\u0026#34;\u0026gt;\u0026lt;/div\u0026gt; \u0026lt;/div\u0026gt; el-col-md-24 : 电脑端宽度设定 控制图形父容器的宽度, 整行分成24个栅格, 如果你想让图形占一半, 就可以改成el-col-md-12 el-col-xs-24 ：移动端宽度设定 padding:0.5% 0.5%: 控制图形的上下, 左右内边距, padding: 上 右 下 左 比如你想要图形在容器中往下走一点, 你可写成 padding: 1% 0 0 0 height:50%; 盒子的高度, 相对于父容器的高度， 最外层即浏览器高度 推荐使用拖拽布局（PRO) # 只是用响应式布局可能对于复杂的布局不是很方便, 你也可以采用拖拽绝对定位的方法, 这样你可以随意指定图形的所在位置. 方法可参考视屏 拖拽说明 你可以配合使用 ”模板开发“ 来实现高度定制化的效果， 参考 模板开发指引\n混合布局(PRO) # 你可以考虑先用响应式布局把整体框架画出来, 如果要加一下装饰的情况, 可以用绝对定位(拖拽布局)来实现\n"},{"id":9,"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/","title":"参数编写方法","section":"5.参数及联动钻取","content":" 使用场景 # 需要使用图表联动效果 数据服务接口开发 使用魔法方法(smartchart独创,拒绝抄袭) # 基础原理 # 1. $参数名 : 当有传递参数时将替换相关的值 2. /* ... $参数名 ... */ : 当参数写在这个区间时, 如果外部没有传入参数, 会自动忽略这一段代码 3. -- : 标识之后单行的代码会被忽略 常见组合应用 # 理解以下样列后, 可录活使用组合出各种可能的需求\n默认参数: 实现在不传参数时默认参数是当前月份 select xx from tablename where calmonth =/*\u0026#39;$calmonth\u0026#39; -- */ to_char(sysdate,\u0026#39;YYYYMM\u0026#39;) 多个参数: 注意使用1=1及and的位置 select xx from tablename where 1=1 /* and city = \u0026#39;$city\u0026#39; */ /* and calmonth =\u0026#39;$calmonth\u0026#39;*/ 维度变化: 将字段当成参数 select /*$calmonth,*/ city, count(1) as qty from tablename group by /*$calmonth,*/ city 维度变化: 当传入月份条件时, 按城市,月份的数据, 不传参数时只看按城市的总数 select /*月份, -- $Month */ 城市, sum(度量) from tablename where 1=1 /* and 月份 \u0026gt; \u0026#39;$Month\u0026#39; */ group by 城市 /*,月份 -- $Month*/ 高级开关应用 # 以上应用可以通过参数是否有传递来实现开关代码段的效果, 有些场景可能还希望通过参数值来进行代码段的开关 如下代码可以实现当传递参数type=1 或 type=2 时执行不同的代码段 使用 \u0026ldquo;$参数__值\u0026rdquo; 的方式做为开关\n/* select count(1) as qty from tablename1 $type__1*/ /* select count(1) as qty from tablename2 $type__2*/ 再比如 当参数D传值为\u0026quot;月份\u0026quot;时是统计2022年按月的统计, 传\u0026quot;日期\u0026quot;时统计的是2022年10月按天的统计\nselect $D, count(1) as qty from tablename where 1 = 1 /* and year=\u0026#39;2022\u0026#39; -- $D__日期 $D__月份 */ /* and month=\u0026#39;10\u0026#39; -- $D__日期 */ group by $D 加了\u0026quot;\u0026ndash;\u0026ldquo;是为了避免语法错误\n数据集开发调试参数方法 # 对于开发人员来说, 带参数的SQL调试不方便, 所以支持你在sql中写入默认参数 方法如下格式, 你可以在sql编辑器的最上方写上 /* {xxxxxx} */, 会默认在开发调试模式下取这些参数, 在用户模式下会忽略\n/* {\u0026#34;月份\u0026#34;:\u0026#34;202009\u0026#34;,\u0026#34;城市\u0026#34;:\u0026#34;中山\u0026#34;} */ select xxx from table xxx 数据权限行级别控制 # 当你在sql查询中加上\u0026rsquo;$username\u0026rsquo;, 会自动替换成登录用户的用户名 如果你是嵌入到第三方系统, 你可以通过url传递参数id, 在后台会转化为参数_id, 在sql中配置$_id即可控制数据权限 可以采用此做数据权限关联后台权限mapping表进行数据权限控制实现不同人看不同的数据 参数的传递方式 # 你可以从url传入参数, 在url上加入 \u0026amp;param={\u0026ldquo;参数名\u0026rdquo;:\u0026ldquo;参数值\u0026rdquo;} 在图形联动的点击过程中会自动传递参数， 具体参考联动相关文档 TIPS 当设定参数后, 联动过程dataset的缓存功能失效, 所以不要让带参数的查询设计得太慢 参数如果存在一些非法字符可能会有问题, 比如参数中不可以有#号\n"},{"id":10,"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/","title":"模板开发界面","section":"低代码开发","content":" 低代码化开发 # smartchart的标准模板为了标准化的原因,对于引用JS,编写CSS等有一定不方便性, 但有时候你可能需要放飞自由, 随意定制 你甚至可能想引用一些其它的UI组件, 所以smartchart给你一个原汗原味的开发空间\n开启方式 # 在高级设定中开启模板 主菜单中会多出来一个 模板 的功能 进入模板编辑界面 "},{"id":11,"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/","title":"简单嵌入","section":"7.报表嵌入","content":"你可能需要把Smartchart生成的图形嵌入到其它系统 首先，所有smartchart设计出来的仪表盘都有一个访问url 你可以直接访问：\nhttp://localhost:8000/echart?type=仪表盘名称 如：http://localhost:8000/echart?type=demo 但是smartchart默认是有权限管理的，所以如果你需要嵌入你自已的系统又不考虑权限，你可以在“设定” \u0026ndash;\u0026gt; 公开 然后在你的网页就可以直接iframe了\n\u0026lt;iframe src=\u0026#34;http://localhost:8000/echart?type=demo\u0026#34; style=\u0026#34;width:100%;height:100%\u0026#34;\u0026gt;\u0026lt;/iframe\u0026gt; "},{"id":12,"href":"/docs/8.Django%E5%BA%94%E7%94%A8/%E5%B5%8C%E5%85%A5Django-Apps/","title":"嵌入 Django Apps","section":"8. Django应用","content":" 应用场景 # 你可以在你的django项目中直接使用smartchart做为插件的方式 你可以查看相关视屏\n使用方法 # 在你的setting.py的INSTALL_APPS中加入\u0026rsquo;smart_chart.echart' 如果你需要simpleui, 你可以在最上行加入我们适配好的\u0026rsquo;smart_chart.smartui\u0026rsquo; INSTALLED_APPS = [ \u0026#39;smart_chart.smartui\u0026#39;, .... .... \u0026#39;smart_chart.echart\u0026#39; ] MIDDLEWARE 中注释掉XFrameOptionsMiddleware\n检查确保在Templates的设定处有DIRS的相关设定\nTEMPLATES = [ { \u0026#39;BACKEND\u0026#39;: \u0026#39;django.template.backends.django.DjangoTemplates\u0026#39;, \u0026#39;DIRS\u0026#39;: [BASE_DIR / \u0026#39;templates\u0026#39;], #此处需要有 \u0026#39;APP_DIRS\u0026#39;: True, #也要有 ..... }, ] setting.py中设定为中国时区, 支持中文基础平台建设! LANGUAGE_CODE = \u0026#39;zh-hans\u0026#39; TIME_ZONE = \u0026#39;Asia/Shanghai\u0026#39; USE_I18N = True USE_L10N = True USE_TZ = False # 此处必须为False 在你的url.py中加入引用 from django.conf.urls import include from django.views.generic import RedirectView url.py的urlpatterns中加入路由 path(\u0026#39;echart/\u0026#39;, include(\u0026#39;smart_chart.echart.urls\u0026#39;)), path(\u0026#39;\u0026#39;, RedirectView.as_view(url=\u0026#39;echart/index/\u0026#39;)), #首页,可自定义路由 初始化DB, 命令行输入: python manage.py makemigrations python manage.py migrate 建立管理员帐号, 如果已有可忽略 python manage.py createsuperuser 启动服务 python manage.py runserver 10. 点击首页的组件升级进行初始化 :cupid: !!!! 重要！！！ 注意 # 一般来说如果你使用django遇到的问题，都不是smartchart导致的， 作者也很难给你解答， 建议你可以进行有偿问答\n"},{"id":13,"href":"/docs/%E5%85%B3%E4%BA%8E%E6%88%91%E4%BB%AC/","title":"关于我们","section":"Docs","content":" 我们的目标 # 打造全生态的数据应用数据管理的平台，解决中小企业上中台难,上中台贵,见效慢的问题. 平台与时俱进，不断完善与优化中 可以通过视屏了解我们的架构设计 企业数字化与smartchart的一站式解决方案\n我们不提供数据存储与计算引擎, ETL工具, BI工具. 因为已有更优秀的产品，我们只为数据开发人员提供更敏捷的工具与平台，致力于数据服务中台建设，边缘可视化与数据管道产品, 站在巨人的肩上, 让数据更有个性，更灵活与可定制化，由于他的通用性，功能的扩展变得也是非常的Smart\n产品定位 # 实现全生态的数据服务平台(数据收集, 数据加工, 数据分享，数据管理，数据应用)\n产品模块 # 统一的数据处理调度平台、数据管道, 是基于Apache顶级项目Airflow上的二次开发产品,让数据处理的任务调度开发与管理微代码化，我们的设计理念是让开发者更方便的同时，不丧失灵活和高度可自定义，如果你使用过smartchat，你可以想象他会带来的便捷性， 产品名为smartpip, 为啥不叫smartpipe, 因为能省我们就要省\u0026hellip; 统一的可视化管理平台, 为微信等第三方应用, 提供powerbi,tableau,finebi\u0026hellip;的嵌入式及功能扩展服务，数据集即服务，一切为数据集 统一的数据上传平台, 实现线下数据的收集需求, 并提供专业的手工上传数据产品, 支持excel本地(安装与免安装版本), 支持WEB端 统一的数据分享平台与smartchart集成，可做为数据服务中台, 实现业务对数据下载的需要及为第三方提供获取数据的API接口 SmartChart可视化平台, 新一代的数据可视化产品, 解决传统BI各种痛点问题,真正面向开发人员的平台产品 元数据管理平台及数据治理，让数据的来源更清晰, 让数据应用更方便，具备自动化，可视化的数据血缘分析 新一代极速数据仓库技术, 极简架构即可实现在大数据应用的全场景需求 "},{"id":14,"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/","title":"专业版本说明","section":"1.基础操作","content":" 版权声明 # 为项目能持续维护，并保持稳定的模式，按照社区投票的意见, 开始区分免费版本和专业版本 目前免费版本无需激活， 你可以使用到常用的功能，我们也会保持持续的更新 为保持项目的健康发展，如需进行商用，您需提供使用方并知会作者进行授权\n免费版使用者必须保留SmartChart相关版权标识及LOGO，禁止对其进行修改和删除 如果违反，将保留对侵权者追究责任的权利\n激活方式 # 您在初次安装Smartchart后会自动免费激活10天的专业版本, 之后专业版本功能会限制使用 请务必仔细阅读免费版本与专业版本的区别, 避免带来的不便 后续如果您还需要继续体验专业版本， 点击查看激活试用方式， 如果您是企业用途，建意使用专业版，获取更快的开发效率，可视化效果, 可靠性的保障及极速的查询体验\n针对个人独立开发者,你可以采用廉价的专业版仪表盘激活方案, 可满足小项目的可视化要求 如果需要永久激活专业版，可关注公众号与客服联系,或扫码联系微信客服了解, 非诚勿扰\n微信客服不提供技术咨询, 如有使用方法的疑惑,建意加QQ群:476715246 进行沟通\n免费版本与专业版本对比: # 功能 免费版 专业版 中台版 个人版 栅格布局 V V V V DATAV V V V V 拖拽布局 V V V 自由开发 V V V 切换图表主题 V V V 主题自由设计 V V V 引入JS V V V 引入CSS V V V 上传静态资源 V V V 使用VUE V V V V 数据集开发 V V V V 所有数据源 V V V V 图形开发 V V V V 图形商店 V V V V 普通模板应用 V V V V 专业模板应用 V V V 复制仪表盘 V V V V 钻取 V V V V 联动 V V V V 筛选 V V V V 单点登录 V V V V 嵌入认证 V V V LDAP认证 V V V Juypter V V V V 快捷存档 V V V 数据加速 V V V 数据API服务 V V V 后台API刷新 V V V 仪表盘同步 V V V 仪表盘版本管理 V V V 数据填报 V V V 报表Portal V V V 多级项目菜单 V 商业授权 V V 优先咨询 V V 专业边框背景 V V 3D场景 V V V 中国式报表 V V V 零代码数据集 V V V 生产部署文档 V V 个性化修改 V V 授权书 V V 低代码ETL V 调度平台 V 智慧BI V 数据资产 V 数据质量 V 数据血缘 V 租户管理 V "},{"id":15,"href":"/docs/1.%E5%9F%BA%E7%A1%80%E6%93%8D%E4%BD%9C/VUE%E7%9B%B8%E5%85%B3/ElementUI/","title":"Element Ui","section":"Vue相关","content":" 应用场景 # 非大屏场景应用 有较多交互场景的报表, 如筛选,表格,分页,下载等 使用方法 # 如下图, base.html 改为 basevue.html 将自动开启加载vue和elementui 注意vue的变量引用在 模板编辑界面中, 写法变更为 {[ ]}\nElementUI组件说明 视屏参考\n参考样列 # 新增一个数据集(点击金色的新增按钮, 这样会新增一个可拖拽的数据集) 修改相应的数据集及图形 数据集端\nselect H1, H2, qty, rate from smartdemo2 limit 100 图形端\nlet dataset = __dataset__; let tableData = ds_createMap_all(dataset); vapp.d0={ tableData: tableData } 模板Body区端\n\u0026lt;div class=\u0026#34;smtdrag\u0026#34; id=\u0026#34;id_1639824145817\u0026#34;\u0026gt; \u0026lt;template\u0026gt; \u0026lt;el-table stripe border height=\u0026#34;100%\u0026#34; :data=\u0026#34;d0.tableData\u0026#34; style=\u0026#34;width: 100%\u0026#34;\u0026gt; \u0026lt;el-table-column label=\u0026#34;hero\u0026#34;\u0026gt; \u0026lt;el-table-column prop=\u0026#34;H1\u0026#34; label=\u0026#34;H1\u0026#34; fixed :default-sort = \u0026#34;{prop: \u0026#39;H2\u0026#39;, order: \u0026#39;descending\u0026#39;}\u0026#34; width=\u0026#34;180\u0026#34;\u0026gt; \u0026lt;/el-table-column\u0026gt; \u0026lt;el-table-column prop=\u0026#34;H2\u0026#34; label=\u0026#34;H2\u0026#34; sortable width=\u0026#34;180\u0026#34;\u0026gt; \u0026lt;/el-table-column\u0026gt; \u0026lt;/el-table-column\u0026gt; \u0026lt;el-table-column sortable prop=\u0026#34;qty\u0026#34; label=\u0026#34;qty\u0026#34;\u0026gt; \u0026lt;/el-table-column\u0026gt; \u0026lt;el-table-column prop=\u0026#34;rate\u0026#34; label=\u0026#34;rate\u0026#34;\u0026gt; \u0026lt;/el-table-column\u0026gt; \u0026lt;/el-table\u0026gt; \u0026lt;/template\u0026gt; \u0026lt;/div\u0026gt; "},{"id":16,"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/","title":"复制仪表盘","section":"不太重要","content":" 复制仪表盘 # 好不容易开发好了一个仪表盘, 想再做一个类似的, 或者想要一个测试用, 还需要一个个数据集, 图形复制粘贴么, 不, 你仅仅只需要点击下, 将给你复制出一个全新的仪表盘 注意: 复制出来的仪表盘, 数据集是与原仪表盘公用的！！\n如果你想将数据集独立出来, 可以按下图操作, 进入数据集设定, 点击磁铁, 将为你自动创建一个全新的数据集 "},{"id":17,"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/","title":"Sql数据集","section":"2.数据集说明","content":" 前言 # 使用最广泛的数据集一般都是SQL数据集 SmartChart标准数据集你可以想象为一个EXCEL的二维表, 有行和列 你直接在数据集开发界面填写SQL即可 更多数据集说明查看\u0026quot;特殊数据源\u0026quot; 动态传参数据集查看\u0026quot;参数及联动\u0026quot;章节 标准图形的数据表类型 # A类数据源 # # 比如你的原始数据库中表的格式如下, 表名tb_name: 城市 户型 数量 长沙 A 12 长沙 A 23 上海 B 19 # 查询的sql: select 城市,户型,sum(数量) AS 数量 from tb_name group by 城市,户型 # 正常的查询的结果为: [[\u0026#39;城市\u0026#39;,\u0026#39;户型\u0026#39;,\u0026#39;数量\u0026#39;], [\u0026#39;长沙\u0026#39;,\u0026#39;A\u0026#39;,35], [\u0026#39;上海\u0026#39;,\u0026#39;B \u0026#39;,19]] # 由于生成的数据格式第二行是 [字符,字符,数值], 后台会自动进行转列动作, # 生成图表更容易使用格式: [[\u0026#39;Categroy\u0026#39;,\u0026#39;A\u0026#39;,\u0026#39;B\u0026#39;], [\u0026#39;长沙\u0026#39;, 35, 0], [\u0026#39;上海\u0026#39;, 0, 19]] B类数据源 # # 再比如我们有一个表的数据格式, 指标是展开的: 城市 A B 长沙 10 12 上海 11 19 长沙 9 10 # 我们可以写的sql是: select 城市, sum(A) as A, sum(B) as B from tb_name group by 城市 # 这样得到的结果是: [[\u0026#39;城市\u0026#39;,\u0026#39;A\u0026#39;,\u0026#39;B\u0026#39;], [\u0026#39;长沙\u0026#39;, 19, 22], [\u0026#39;上海\u0026#39;, 11, 19]] 这样和我们的标准格式也是一样的 SQL多段查询 # 有时你一个数据集可能只用一个SQL查询还不够，比如你需要一个清单数据，同时你需要一个汇总数据做为说明在图形中显示，这样你就需要使用多条SQL语句，在数据集中的写法你只需要用分号隔开，如：\n//数据集中的查询 select ... from xxx; select ..... from xxxxxxx // 传递到图形中的格式为: {\u0026#34;df0\u0026#34;:[[...]]. \u0026#34;df1\u0026#34;:[[......]]} df0, df1分别对应的是第一段和第二段查询 多段查询使用视屏参考\n"},{"id":18,"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/","title":"Python数据集","section":"特殊数据源","content":" 应用场景 # 当SQL查询无法满足你的需求, 你需要对查询后的结果进行处理, 或者你需要使用Excel的数据源, 甚至你需要对不同系统的数据进行查询, Python连接器可以帮到你 我们又称他为万能数据集， 你可以使用任何python语法， 需要把数据集的结果赋值给ds变量!!\n首先你需要新建python连接器, 由于安全控制只允许超级管理员建立 # 内置函数说明 ds_get(id) #输入目标数据集的id名, 可以获取目标数据集 ds_df(id) #输入目标数据集的id名, 转化成pandas的df对象 ds_sql(conn_name, sql_str) #输入连接池中的名称, SQL语句, 获取数据集 ds_list(df) #将pandas的df对象转化成数据集 使用方法样列说明 # 读取Excel数据处理, 如需上传页面可参考\u0026quot;数据上传\u0026quot;说明\nimport pandas as pd df = pd.read_excel(\u0026#39;文件路径\u0026#39;, \u0026#39;表名\u0026#39;) df = df.groupby(\u0026#39;c3\u0026#39;).agg({\u0026#39;qty\u0026#39;:\u0026#39;sum\u0026#39;}).reset_index() ds = ds_list(df) 从数据集获取数据后进行处理\nds=ds_get(12) ds=ds[:15] 从数据集获取数据转化成pandas对象处理\ndf = ds_df(12) df = df.sort_values(by=\u0026#34;出场数\u0026#34;, ascending=False) ds = ds_list(df) 生成字典格式的数据集供多个图形使用\nimport pandas as pd df = pd.read_excel(\u0026#39;/Users/../smartdemo.xlsx\u0026#39;, \u0026#39;demo\u0026#39;) df0 = df.groupby(\u0026#39;c3\u0026#39;).agg({\u0026#39;qty\u0026#39;:\u0026#39;sum\u0026#39;}).reset_index() df1 = df.groupby([\u0026#39;province\u0026#39;,\u0026#39;c3\u0026#39;]).agg({\u0026#39;qty\u0026#39;:\u0026#39;sum\u0026#39;}).reset_index() ds = {\u0026#39;df0\u0026#39;: ds_list(df0), \u0026#39;df1\u0026#39;: ds_list(df1)} 直接执行SQL,可用于跨数据源处理\nsql_str = \u0026#39;\u0026#39;\u0026#39;select H1 as heroname, sum(qty) as 出场数 from T /* where H2 = \u0026#39;$H2\u0026#39; */ group by H1 order by sum(qty) desc\u0026#39;\u0026#39;\u0026#39; ds = ds_sql(\u0026#39;连接名称\u0026#39;, sql_str) ds = ds[:10] "},{"id":19,"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/","title":"Jquery遍历方法","section":"函数方法","content":"在做自定义html组件的时候你可能需要用得上：\n一、向上遍历\nparent() 获取元素的直接父元素 $(\u0026#34;span\u0026#34;).parent().css({ \u0026#34;color\u0026#34;:\u0026#34;red\u0026#34;, \u0026#34;border\u0026#34;:\u0026#34;1px solid red\u0026#34; }) parents() 获取元素的祖先元素，直到根元素html $(\u0026#34;span\u0026#34;).parents().css({ \u0026#34;color\u0026#34;:\u0026#34;red\u0026#34;, \u0026#34;border\u0026#34;:\u0026#34;1px solid red\u0026#34; }) parentsUntil() 向上查找直到遇见某个祖先元素为止 $(\u0026#34;span\u0026#34;).parentsUntil(\u0026#34;div\u0026#34;).css({\t//向上查找直到遇见div元素为止 \u0026#34;color\u0026#34;:\u0026#34;red\u0026#34;, \u0026#34;border\u0026#34;:\u0026#34;1px solid red\u0026#34; }) 二、向下遍历\n1. children() 查找子元素[按照从属关系] $(\u0026#34;ul\u0026#34;).children(\u0026#34;li:first-child\u0026#34;) 2. find() 按照指定的条件向下查找 $(\u0026#34;ul\u0026#34;).find(\u0026#34;span\u0026#34;) 三、水平遍历\n1. siblings() 获取元素的所有兄弟元素 $(\u0026#34;.start\u0026#34;).siblings().css({color:\u0026#34;red\u0026#34;,border:\u0026#34;2px solid red\u0026#34;}) 2. next() 获取元素的下一个兄弟元素 $(\u0026#34;.start\u0026#34;).next().css({color:\u0026#34;red\u0026#34;,border:\u0026#34;2px solid red\u0026#34;}) 3. nextAll() 获取其后的所有兄弟元素 $(\u0026#34;.start\u0026#34;).nextAll().css({color:\u0026#34;red\u0026#34;,border:\u0026#34;2px solid red\u0026#34;}) 4. nextUntil() 查找后面所有的兄弟元素，直到遇见某个元素为止 $(\u0026#34;.start\u0026#34;).nextUntil(\u0026#34;li:last-child\u0026#34;).css({color:\u0026#34;red\u0026#34;,border:\u0026#34;2px solid red\u0026#34;}) 5. prev() 查找上一个兄弟元素 $(\u0026#34;li.start\u0026#34;).prev().css({color:\u0026#34;red\u0026#34;,border:\u0026#34;2px solid red\u0026#34;}) 6. prevAll() 查找上面所有的兄弟元素 $(\u0026#34;li.start\u0026#34;).prevAll().css({color:\u0026#34;red\u0026#34;,border:\u0026#34;2px solid red\u0026#34;}) prevUntil() 查找上面所有的兄弟元素，直到遇见某个元素为止 $(\u0026#34;.start\u0026#34;).prevUntil(\u0026#34;li:first\u0026#34;).css({\u0026#34;color\u0026#34;:\u0026#34;red\u0026#34;,\u0026#34;border\u0026#34;:\u0026#34;2px solid red\u0026#34;}) 四、过滤\n1. first() 获取第一个元素 $(\u0026#34;li\u0026#34;).first().css(\u0026#34;color\u0026#34;,\u0026#34;red\u0026#34;); 2. last() 获取最后一个元素 $(\u0026#34;li\u0026#34;).last().css(\u0026#34;color\u0026#34;,\u0026#34;red\u0026#34;); 3. not() 获取不是…的元素 $(\u0026#34;li\u0026#34;).not(\u0026#34;:eq(2)\u0026#34;).css(\u0026#34;font-size\u0026#34;,\u0026#34;26px\u0026#34;); 4. eq(n) 获取索引为n的元素 $(\u0026#34;li\u0026#34;).eq(3).css(\u0026#34;background\u0026#34;,\u0026#34;green\u0026#34;); 5. has() 检测某个子元素是否存在 $(\u0026#34;li\u0026#34;).eq(1).has(\u0026#34;span\u0026#34;).length) 6. filter() 筛选出与符合条件的DOM元素 $(\u0026#34;div\u0026#34;)..filter(\u0026#34;.middle\u0026#34;) 7. is() 用来判断是否符合条件 $(\u0026#34;p\u0026#34;).parent().is(\u0026#34;div\u0026#34;)\t//判断p的父元素是不是div,是就返回true,不是就返回false 五、each遍历\n1. each() 方法为每个匹配元素规定要运行的函数。 $(selector).each(function(index,element){ ..... }) //index 表示当前遍历元素的索引 element 当前的元素（也可使用 \u0026#34;this\u0026#34; 选择器） 2. $.each(obj,function( index,value){}) "},{"id":20,"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/","title":"管理图形","section":"3.图形开发","content":" 应用场景 # 可以快速复用已开发好的图形组件\n本地管理自定义组件 # 如下图,点击图形编辑器中的菜单,即可管理和查看自定义图形列表 点击\u0026quot;加入样列\u0026quot;即可把当前图形加入到样列清单, 点击\u0026quot;取消样列\u0026quot;即可将所选样列移除样列清单 云管理,在图形商店中保存你的图形 # 这样你就可以在图形商店看到你的图形进行重复利用 "},{"id":21,"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/","title":"拖拽自动对齐","section":"4.布局说明","content":"拖拽很方便, 但是精确对齐还是有些手抖, 所以smartchart增加了自动对齐的功能 你可以在\u0026quot;模板\u0026quot; \u0026ndash;\u0026gt; \u0026ldquo;转化\u0026rdquo; 中找到这个功能 首先我们随意拖拽了一些组件 然后选中拖拽代码段, 点\u0026quot;拖拽对齐\u0026quot; 后 点\u0026quot;保存\u0026quot; 就可以查看对齐后的效果了, 再进行下拖拽微调, 重复以上动作到满意 "},{"id":22,"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/","title":"图形联动钻取","section":"5.参数及联动钻取","content":" 数据集准备 # 首先在需要进行联动的数据集中SQL的写法如下, 比如对应2号图形:\n注意 /* ... */的写法, 当参数写在这个区间时, 如果外部没有传入参数, 会自动忽略这一段代码, 这样对于联动来说非常重要, 初始时全部显示, 点击其它图形时传入参数进行动态联动 select xxx,xxx,xxx from tablename /* where xxxx = \u0026#39;$参数名\u0026#39; */ .... 建意观看视屏比较容易理解: 数据联动说明\n常规方法 # 比如你需要点击0号图形, 指定其它图形联动 你只需要打开0号图形的数据集编辑页面, 点击标题的位置 然后输入相关的参数即可, 以下为sample 参数值设定的方法, 你可以先留空, 然后保存, F12打开浏览器调试方法 点击0号图形你需要点击的动作, 你可以在调试窗口的console看到输入的log 比如我们需要传递的参数值是\u0026quot;廉颇\u0026quot;, 那么取数据的方法就是data.name, 你把这个填入即可 这样就实现按所选数据或所选系列钻取/联动了, 重新点击当前所选, 恢复原来的\nTIPS: 在图形编辑器中, 可以使用函数 ds_param(\u0026lsquo;参数名\u0026rsquo;) 来获取传入的参数值\n高级定制方法 # 如有更多个性化需求,可在需要点击的图形的编辑器中加入以下代码,仅需修改的是序号和参数名\n//比如传入多个参数进行联动 myChart__name__.on(\u0026#39;click\u0026#39;, function(params){ let myparam = params.seriesName; //获取点击的值 ds_setParam(\u0026#39;参数名\u0026#39;, myparam); //填写你的数据集的SQL设定中对应的参数名 ds_setParam(\u0026#39;参数名2\u0026#39;, myparam2); //你可以赋值给多个参数 ds_refresh(3); //3 为你要刷新图形序号 }); //函数方法说明 ds_setParam(\u0026#39;参数名\u0026#39;, 参数值) 此方法将自动判断当参数值为空,null或0时, 删除参数回到初始未传参状态 所以请注意此方法无法传递参数空,null及0, 如需传递请将0转化成字符 你还可以实现钻取到另外一个报表\nmyChart__name__.on(\u0026#39;click\u0026#39;, function (params) { let myparam = `\u0026amp;param={\u0026#34;参数名\u0026#34;: \u0026#34;${params.seriesName}\u0026#34;}`; //拼成url并传参，具体参考数据集说明中的数据联动url传参的方法 let myurl=\u0026#39;http://localhost:8000/echart/?type=目标报表名\u0026#39;+ myparam; window.open(myurl,\u0026#39;_blank\u0026#39;,\u0026#39;toolbar=no,scrollbar=no,top=100,left=100,width=800,height=500\u0026#39;); }); TIPS 如果你的参数中存在非法字符如\u0026amp;=, 你可以使用encodeURIComponent函数进行转义后赋值\n"},{"id":23,"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/","title":"快捷开发","section":"低代码开发","content":" 应用场景 # 专业化开发, 可将仪表盘显示和模板开发分屏开发 当你熟悉smartchart的基础开发后, 你可能会喜欢上现在这种方式 把你的可视化页面移动的显示器上吧, 进入\u0026quot;模板\u0026quot; 开发页面(上节介绍如何进入)\n方式一: 自动化DIV # 此方式当你新增数据集图形时会自动识别, 无需手动在模板在添加 采用此方式请不要采用点击模板上方菜单的图形新增 如需编辑图形或数据集可按如下方式: 方式二: 自由DIV # 你可以模板中按照常规的H5页面编辑, 只是在需要插入图形的地方插入即可(建意通过模板上方的图形新增) 开始畅快的开发\n点击图形即可新增一个图形,你甚至可以指定图表的位置, 完全和写html一样, 图形代码段:{{div_list.图表顺序号}} 注意自由DIV模式下的新增图形, 是不自带容器的, 如有需要,可选中\u0026quot;图形代码\u0026quot;,点击菜单的容器包裹上容器 如果使用自由布局, 请删除自动化DIV这一段代码 选中生成的图形代码段, 点击菜单栏的 数据集, 图形, 布局开发或使用CTRL+Q， 即可进入开发界面, 如果没有数据集, 会自动帮你新建 可以观看视屏, 视屏比较老和现在不太一样, 仅参考即可 自由开发模式视屏\n"},{"id":24,"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/","title":"数据服务 API","section":"数据服务","content":" SmartChart的数据集功能, 可以非常方便的实现数据对外微服务 # 权限设定 # 帐号访问权限 # 超级管理员可以在首页右上角用户图标的菜单中, 找到\u0026quot;服务配置\u0026quot;打开 比如需要调用API的用户名为test 和 test2，用户名需要是在你的用户设定中存在的,内容如下: { \u0026#34;test\u0026#34;: { \u0026#34;token\u0026#34;: \u0026#34;smartchart\u0026#34; }, \u0026#34;test2\u0026#34;: { \u0026#34;token\u0026#34;: \u0026#34;smartchartxxx\u0026#34;, \u0026#34;host\u0026#34;: [\u0026#34;10.10.10.10\u0026#34;,\u0026#34;10.10.10.23\u0026#34;], \u0026#34;limit\u0026#34;: 60, \u0026#34;log\u0026#34;:1, \u0026#34;cors\u0026#34;: 1 } } 可选设定参考test2 host:API白名单配置，limit:一分钟内可调用次数, log:日志记录方式. cors:永许跨域访问\n数据集权限 # 在数据集权限管理中, 将你需要开放的数据集的权限, 设定给对应的用户 请求方式 # 加密接口请求方式（推荐） # 下文提到的\u0026quot;秘钥\u0026quot;即上文设定中的\u0026quot;token\u0026quot;, 注意上文的token非下文提到的token\nGET 请求 # #接口请求格式: url= \u0026#39;/echart/dataset_api/?visitor=xxx\u0026amp;token=xxx\u0026amp;type=xxx\u0026amp;stamp=xxxxx\u0026amp;param={\u0026#34;xx\u0026#34;:\u0026#34;xxx\u0026#34;,\u0026#34;xx\u0026#34;:\u0026#34;xxxx\u0026#34;}\u0026#39; # 参数说明 visitor: 用户名 type: 接口数据集ID stamp: 时间戳(1970年1月1日到生成时间的毫秒数) token: 采用sha1加密, token=SHA1(秘钥 + stamp + visitor + type) param: 数据集查询参数清单(可选), 格式json字符串, 如: \u0026#39;{\u0026#34;参数A\u0026#34;:\u0026#34;xxxx\u0026#34;, \u0026#34;参数B\u0026#34;:\u0026#34;xxxx\u0026#34;}\u0026#39; # 接口返回格式Json: { \u0026#34;data\u0026#34;:[[]], \u0026#34;result\u0026#34;:\u0026#34;success\u0026#34;, \u0026#34;maxpg\u0026#34;:1, \u0026#34;pg\u0026#34;:1 } # 返回值说明: data : 二维数组, 第一行为表头, 样列数据如下 [[\u0026#34;heroname\u0026#34;, \u0026#34;qty\u0026#34;],[\u0026#34;镜\u0026#34;,658],[\u0026#34;猪八戒\u0026#34;,591]] result : success 或 error maxpg/pg : GET请求固定为1不分页 POST请求(适用于后台定时同步数据，查询请用GET请求方法) # #接口请求格式: url: /echart/dataset_api/ # 请求参数data: { \u0026#34;visitor\u0026#34;:\u0026#34;xxx\u0026#34;, \u0026#34;token\u0026#34;:\u0026#34;xxx\u0026#34;, \u0026#34;stamp\u0026#34;:xxxxx, \u0026#34;type\u0026#34;:\u0026#34;xxx\u0026#34;, \u0026#34;pagesize\u0026#34;:\u0026#34;xxx\u0026#34;, \u0026#34;pg\u0026#34;:\u0026#34;xxx\u0026#34;, \u0026#34;param\u0026#34;:\u0026#39;{\u0026#34;xxx\u0026#34;:\u0026#34;xxxx\u0026#34;}\u0026#39; } # data参数说明 visitor: 用户名 type: 接口数据集ID stamp: 时间戳(1970年1月1日到生成时间的毫秒数) token: 采用sha1加密, token=SHA1(秘钥 + stamp + visitor + type) Pagesize: 采用分页, 每页的数据量大小 pg: 返回第几页 param: 数据集查询参数清单(可单), 拼接成json字符串, 如: \u0026#39;{\u0026#34;参数A\u0026#34;:\u0026#34;xxxx\u0026#34;, \u0026#34;参数B\u0026#34;:\u0026#34;xxxx\u0026#34;}\u0026#39; #接口返回格式Json: { \u0026#34;data\u0026#34;:[[]], \u0026#34;result\u0026#34;:\u0026#34;success\u0026#34;, \u0026#34;maxpg\u0026#34;:xxx, #最大页数 \u0026#34;pg\u0026#34;:xx, #当前页数 \u0026#34;casheflag\u0026#34;: xx, #如果是999说明命中缓存 \u0026#34;total\u0026#34;:xx, #总条数 } 注意： 只有post是分页的, 第一页是带标题的， 后面页不带标题 由于post方式会使用缓存进行分页,如命中缓存传参不会生效，小数据量请使用get方式请求 不要请求大数据量，大量数据请采用limit, offset传参方式进行分页\n不加密请求方式(简单但不安全） # GET 请求 #接口请求格式: url= \u0026#39;/echart/dataset_api/?visitor=xxx\u0026amp;token=xxx\u0026amp;type=数据集名或id\u0026#39; #接口返回格式Json: { \u0026#34;data\u0026#34;:[[]], \u0026#34;result\u0026#34;:\u0026#34;success\u0026#34;, \u0026#34;maxpg\u0026#34;:1, \u0026#34;pg\u0026#34;:1 } POST请求 #接口请求格式: url: /echart/dataset_api/ data: { \u0026#34;visitor\u0026#34;:\u0026#34;xxx\u0026#34;, \u0026#34;token\u0026#34;:\u0026#34;xxx\u0026#34;, \u0026#34;type\u0026#34;:\u0026#34;xxx\u0026#34;, #数据集名或id名 \u0026#34;pagesize\u0026#34;:\u0026#34;xxx\u0026#34;, #每页数据条数 \u0026#34;pg\u0026#34;:\u0026#34;xxx\u0026#34;, #返回第几页 \u0026#34;param\u0026#34;:\u0026#39;{\u0026#34;xxx\u0026#34;:\u0026#34;xxxx\u0026#34;}\u0026#39; #参数可选 } #接口返回格式Json: { \u0026#34;data\u0026#34;:[[]], \u0026#34;result\u0026#34;:\u0026#34;success\u0026#34;, \u0026#34;maxpg\u0026#34;:xxx, #最大页数 \u0026#34;pg\u0026#34;:xx, #当前页数 \u0026#34;casheflag\u0026#34;: xx, #如果是999说明命中缓存 \u0026#34;total\u0026#34;:xx, #总条数 } 注意: 只有post是分页的, 第一页是带标题的, 后面页不带标题 由于post方式会使用缓存, 小数据量建议你使用get方式请求 "},{"id":25,"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/","title":"单点登录","section":"7.报表嵌入","content":" 单点登录的方式与smartchart进行对接嵌入 # \u0026#39;/echart/smart_login?id=xxx\u0026amp;stamp=xxx\u0026amp;token=xxx\u0026amp;url=/\u0026#39; \u0026#39;\u0026#39;\u0026#39; 参数说明： id: 用户名（在smartchart平台中管理） stamp: 时间戳(1970年1月1日到生成时间的毫秒数) token: 采用sha1加密, token=SHA1(链接秘钥+stamp+id) 请在安装smartchart的这台机器上设定环境变量SMART_KEY = 链接秘钥 url: 登录成功后跳转链接 \u0026#39;\u0026#39;\u0026#39; Python后台样列: # import time import hashlib import os \u0026#34;\u0026#34;\u0026#34; 参数说明： id: 用户名（在smartchart平台中管理） stamp: 时间戳(1970年1月1日到生成时间的毫秒数) token: 采用sha1加密, token=SHA1(链接秘钥+stamp+id) url: 登录成功后跳转链接 \u0026#34;\u0026#34;\u0026#34; SMART_CHART_URL = \u0026#39;http://127.0.0.1:8000\u0026#39; LOGIN_URL = SMART_CHART_URL + \u0026#39;/echart/smart_login?id={id}\u0026amp;stamp={stamp}\u0026amp;token={token}\u0026amp;url={url}\u0026#39; SMART_KEY = 链接秘钥 def get_smarturl(username, url=\u0026#39;/\u0026#39;): stamp = int(time.time() * 1000) id = username res = SMART_KEY + str(stamp) + id token = hashlib.sha1(res.encode(\u0026#39;utf-8\u0026#39;)).hexdigest() LOGIN_DICT = { \u0026#34;id\u0026#34;: id, \u0026#34;stamp\u0026#34;: stamp, \u0026#34;token\u0026#34;: token, \u0026#34;url\u0026#34;: url } # 拼接好的url,直接访问 visit_url = LOGIN_URL.format(**LOGIN_DICT) return visit_url "},{"id":26,"href":"/docs/8.Django%E5%BA%94%E7%94%A8/FAQ/","title":"Faq","section":"8. Django应用","content":" FAQ # 如果你想对smartchart前端二次开发或关闭debug模式后找不到资源 在settings中加入\nSTATIC_ROOT = os.path.join(BASE_DIR, \u0026#34;static\u0026#34;) 执行以下命令将静态文件静态文件克隆到根目录\npython3 manage.py collectstatic "},{"id":27,"href":"/docs/%E8%AE%BE%E8%AE%A1%E7%90%86%E5%BF%B5/","title":"设计理念","section":"Docs","content":"Smartchart6.0 已发布, 带来全新的功能与体验\n设计哲学: # 她是基于真实应用场景的敏捷数据中台而设计的产品,已成熟在多个大型企业应用多年,不仅是一个可视化低代码开发平台, 也是数据接口低代码, 甚至是业务系统低代码开发平台 支持多种混合布局, 对于普通报表可以使用响应式布局同时满足大屏, 电脑, 平板, 手机端的页面, 对于大屏也可使用拖拽辅助布局来配合自由开发模式(专业版) 她是面向开发者, 如果需要设计出来非常漂亮有个性的数据展现形式, 我们发现如果要达到这个目的, 不管用什么开发工具, 最终还是需要用户了解一些基础的html, css, echarts的配置, 如果去学习某个平台中要在那些地方点点点的界面上进行配置, 那么为什么不去学习使用原生的呢, 这样反而更简单, 用户可以找到的参考资源更全面, 甚至可以从社区的代码中直接复制过来, 所以我们设计理念是不自定义开发语言, 而是帮大家建立数据与图形的高速公路, 定义交通规则 和提供服务区 smartchart有很多隐藏功能, 所以初入smartchart的同学会一脸迷惑, 无从下手, 因为我们讲究 精减设计 和 可扩展性 , 如果有些功能只用一次, 就不会让他在界面显示, 我们不推荐不看文档和视屏就直接上手开发的模式, 给你门槛是为了将来使用得不会太累 她重在数据处理的便捷, 联动/刷新机制设计一气呵成, 无缝的原生图形开发工具, 没有拖泥带水的让用户去找设定开关, 你甚至可以使用你喜欢的IDE进行开发, 给开发者充分发挥的自由 smartchart是一个企业级解决方案, 不是一个玩具, 她不喜欢浮躁, 需要你沉下心, 慢慢体验, 属于慢热型, 就好比是做菜, smartchart是给你提供了已经切好的菜和菜谱说明, 你可以按自已喜欢加火放调料就行, 你甚至可以增加新的调料(如css, js引用) 或更换调料. 相比有些产品就是给你准备的是已做好的菜品, 如果你觉得它盐放得太多, 你得清洗下, 再重新回锅, 对于我们开发人员来说, 这是不可忍受的 类似于养成类游戏, 你可以在开发过程中积累图形, 模板等等, 在后面的项目中可以直接用复制粘贴的方式进行复用, 而不需要再界面上重新进行配置调整. 你也可以和其它开发者(厨师)交流, 互通有无, 快速提升自已的等级, 比如购买模板就是最快的方法 与传统BI的区别 # 传统BI面向非技术人员, 更注重于开发的过程无代码化,所以最终实现的可视化效果较差, 可定制化程度低, 访问速度慢,对硬件要求高, 应用场景局限性比较大 smartchart是面向技术人员的可视化产品, 更注重于最终效果, 采用的是低代码技术, 对技术人员更友好, 可定制化高, 可视化效果更好, 访问速度快, 更灵活,对硬件要求低, 应用范围广 与开源大屏设计器区别 # 大屏设计器只关注内置的一些边框, 图形效果等前端效果, 不注重于数据的开发, 华而不实 smartchart是真正意思上的全场景解决方案, 从数据开发, 可视化, 到版本上线管理, 嵌入等工程化场景全覆盖 "},{"id":28,"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/","title":"快速开始","section":"1.基础操作","content":" 开发前视屏 # 6.0介绍视屏 4.0操作视屏教程 5.0变更操作视屏教程 开发系列合集,关注作者持续更新 由于版本的变更, 一些图标可能会有一些变化, 但位置无太大的变化\n安装Python环境 # 环境准备: 官方 最新Python下载链接,可以到 淘宝镜象下载,也可以下载 WINDOWS64位安装版, MAC电脑安装版 Window平台安装视屏介绍,注意: Windows安装Python时需选中\u0026quot;Add to Path\u0026quot; Linux安装可参考文档下方的部署说明, Linux安装说明 安装SmartChart # 在Shell或CMD命令行执行\npip3 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, 请及时更改密码\n如果忘记密码, 可以使用此命令重置 smartchart changepassword 用户名 查看demo # 尝试熟悉编辑菜单 尝试点开数据集查看SQL写法， 图形编辑器， 容器等 仪表盘菜单 # 功能项 子项 使用说明 菜单栏 - 点击可展开隐藏, 可移动位置 设定 常规设定 权限管理,水印,模板应用,版本控制.. 设定 高级设定 开启模板/移动端适应/VUE/DATAV/场景背景.. 设定 批量布局 批量修改容器的HTML, 不常用 设定 容器管理 批量查看/管理/删除容器, 不常用 模板 - 进入低代码开发,引入JS/CSS,上传,组件\u0026hellip; 新增 拖拽图形 新增一个带拖拽容器的图形组件 新增 栅格图形 新增一个带栅格容器的图形组件 新增 上线数据集 新增一个已开发好的数据集(需要是上线状态) 新增 懒加载数据集 新增后在菜单栏可查看编辑,此数据集需自定义触发查询,默认可引用全局变量名为data序号, 如data0 新增 通用数据集 新增后在菜单栏可查看编辑,主动触发查询,全局变量名为data序号, 如data0 新增 静态组件 新增一个不带数据集及图形的html组件, 如图片,文字描述\u0026hellip; 新增 复杂报表 使用类excel的方式开发报表 拖拽开关 - 切换拖拽锁定, 如需编辑EXCEL图形组件, 一般需要锁定 弹窗方式 - 切换编辑器是嵌入方式还是新开页面 自定义主题 - 修改echarts的主题, 仅当前仪表盘有效 调试 - 切换是否显示调试打印的日志,如打开后可以进行精确拖拽定位 主题选择 - 切换显示内置echarts主题 预览 - 切换开发模式下的预览模式 数据集 - 菜单栏会显示未激活/通用/懒加载数据集 仪表盘容器菜单 # 功能项 子项 使用说明 序号 - 唯一标识容器ID,可以通过 #container_序号 来选择容器, 如样式选择:#container_0{}, JS选择:$(\u0026rsquo;#container_0\u0026rsquo;).xx 数据集开发 - 打开数据集开发界面, 可切换数据源,数据定时刷新,数据开发\u0026hellip; 图形开发 - 打开图形开发界面, 可进行实时图形配置调试, 切换内置图形, 自定义图形, 图形商店\u0026hellip; 容器开发 - 打开容器开发界面, 进行栅格布局调整, 拖拽方式不常用\u0026hellip; 隐藏容器 - 将容器切换为未激活状态,如果永久删除\u0026hellip; 高级设定 # 功能项 子项 使用说明 模板开关 - 开启模板开发, 新增拖拽图形后会自动开启 移动适配开关 - 不固定宽高比例模式, 如果非大屏建意开启 VUE - 开启后可以使用VUE模式开发 DATAV - 开启后可以使用DATAV的组件及VUE 极简菜单 - 开启后隐藏仪表盘中不常用工具图标 数据集模式 - 开启后仅用于查看和管理数据集 背景模板 - 可选择预设的大屏背景 数据集开发 # 功能项 子项 使用说明 标题 修改名称 修改数据集名称 标题 联动设定 图形联动相关的配置 标题 权限设定 数据集权限管理 主题 - 全局变更编辑器主题 数据源 - 点击显示默认数据库的表清单 数据源 切换数据源 切换数据源 数据源 编辑数据源 编辑当前数据源配置 数据源 新增数据源 新增数据源 数据源 刷新设定 设定数据集的后台缓存及前端刷新间隔时间 数据源 数据库清单 获取当前数据源所有的数据库清单 数据源 表清单 不选择数据库时, 获取默认数据库表清单, 选中数据库名称,可获取选中数据库表清单 数据源 表结构 选中表名,可获取表的字段描述 数据源 建表语句 选中表名,可获取表的建表语句 数据源 表样列 选中表名,可获取表的样列数据 数据源 表条数 选中表名,可获取表的总条数, 也可选中一段查询获取总条数 执行 - 执行预览数据集,或选中一段脚本执行 保存数据集 - 保存并刷新数据集后台缓存 图形开发 # 功能项 子项 使用说明 实时调试 - 默认开启, 修改配置后, 实时显示图形, 当大量数据处理时, 建意关闭 调色板 - 可进行颜色选择, 需复制颜色代码到配置项 图形 基础图形 系统内置基础图形, 如柱/线/点/饼/中国式报表\u0026hellip;, 可通过配制衍生出各种图形.. 图形 个人图形 可以保存个人修改或转化过的图形进行复用 图形 图形商店 参考smartchart官方样列图形, 复制粘贴即可使用 图形 Echarts社区 参考echarts官方样列图形, 复制粘贴后转化即可使用 参考 - 常用的echarts配置项菜单, 复制粘贴即可使用 工具 转化 将echarts原生图形转化为smartchart 工具 代码 代码折叠/展开等 模板开发 # 功能项 子项 使用说明 图形 - 适用于在将静态模板转化过程中或复杂布局场景使用, 常规建意采用在仪表盘界面中新增 容器 拖拽 选中组件代码段, 将为组件加上拖拽容器代码 容器 栅格 选中组件代码段, 将为组件加上栅格容器代码 容器 DATAV边框 选中组件代码段, 将为组件加上DATAV边框容器代码 编辑 数据集 选中带图形的代码段div_list.xx, 打开数据集编辑, 可用快捷键CTRL+Q 编辑 图形 选中带图形的代码段, 打开图形编辑 编辑 容器 选中带图形的代码段, 打开容器编辑 样式 - 常样html组件样式, 如背景颜色, 字体.. 组件 - 常用html组件, 如图片, 按钮, 轮播.. UI组件 - 常用elementUI组件, 使用方法需参考文档 3D模型 - 加载并使用3D模型场景 资源 - 不太常用的资源, 如加载词云, 地图\u0026hellip; 工具 - 代码折叠,对齐转化,快照定存,文件上传,数据集批量授权.. "},{"id":29,"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/","title":"Data V应用","section":"Vue相关","content":"需要在高级中可开启datav模式\n参考视屏 1. DataV基础应用 2. DataV翻盘器\nDataV配置方法文档: 图表\n"},{"id":30,"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/","title":"共享数据集","section":"数据集形态","content":" 应用场景 # 优化查询, 可一个数据集查询完所有数据进行分发 减少重复查询的浪费, 同一个数据只查询一次 使用方法 # 在仪表盘开发界面, \u0026ldquo;新增\u0026rdquo; \u0026ndash;\u0026gt; \u0026ldquo;共享数据\u0026rdquo; 在\u0026quot;设定\u0026quot; \u0026ndash;\u0026gt; ”高级“ \u0026ndash;\u0026gt;\u0026ldquo;高级设定\u0026rdquo; 中配置 这样3，4号图形都映射到了共享数据集(2号)的数据 当然你也可以任意JS中使用\u0026quot;data序号\u0026quot;这个全局变量, 如上就是data2\n你也可以在数据集中写多个SQL查询 -- 英雄1 select H1, count(1) as qty1 from smartdemo2 group by H1 limit 10; -- 英雄2 select H2, count(1) as qty2 from smartdemo2 group by H2 limit 10 然后在\u0026quot;设定\u0026quot; \u0026ndash;\u0026gt; ”高级“ \u0026ndash;\u0026gt;\u0026ldquo;高级设定\u0026rdquo; 中配置进行数据映射 "},{"id":31,"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/","title":"数据集数据刷新","section":"2.数据集说明","content":" 数据刷新设定方法 # smartchart提供非常精细的数据刷新功能,及内存加速功能 你可以在数据集开发界面的菜单中，连接图标\u0026ndash;\u0026gt;刷新设定，进行设定 定时刷新 # 你可以设定前端页面数据集向后端请求刷新的时间间隔，单位秒\n如果你发现定时刷新，数据并没有变化，可能原因是您数据的缓存时间设定大于定时刷新的时间\n数据集缓存加速（PRO) # smartchart专业版提供内存加速技术，对数据库仅需请求一次，之后都是毫秒级响应\n间隔时间刷新,单位分钟,如设定间隔时间为0.5, 则如果下一次访问时间超过30秒, 即触发数据刷新 固定时点刷新, 如设定间隔时间为-1, 则固定时点刷新, 即访问的时间超过固定的时点时(如上图每天12:39), 触发数据刷新 强制刷新, 访问url加上\u0026amp;refresh=Y, 则强制刷新数据, 此刷新不会影响间隔或固定刷新的时间, 不会更新下次同步时间 后台触发强制刷新 (PRO) # 请参考文档 后台主动触发刷新\n"},{"id":32,"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/","title":"自定义数据源","section":"特殊数据源","content":" smartchart已实现大部分常用的数据源连接, 对于其它的, 您也可以使用python数据源进行处理 但是使用python数据源有一定的缺陷, 需要在dataset上写python代码, 不能复用 对于一些带连接信息的还需要重复写入 所以你还可以使用自定义数据源\n应用场景 # 未内置的数据源, 如需要使用sparkSQL, ES等 标准处理满足不了要求, 需要对数据进行预处理的情况 需要刷新时触发预警等自定义动作 需要自定义写入方法, 个性化查询需求, 甚至是实时爬取数据 使用方法 # 首先你需要新建一个python脚本文件, 如diy_conn.py 复制以下代码到这个文件, 然后编写你的自定义查询方法 def dataset(*args, **kwargs): \u0026#34;\u0026#34;\u0026#34; 返回查询数据集 :return: 二维数组或JSON字典 \u0026#34;\u0026#34;\u0026#34; sqlList = args[0] # 数据集编辑界面的输入已按分号拆分成数组 [sql1, sql2...] config = args[1] # 相关的配置字典{\u0026#39;host\u0026#39;,\u0026#39;port\u0026#39;,\u0026#39;user\u0026#39;,\u0026#39;password\u0026#39;,\u0026#39;db\u0026#39;} # 插入你的数据查询及处理代码, 生成result即可 result = [[]] return result def insert_dataset(*args, **kwargs): \u0026#34;\u0026#34;\u0026#34; 数据填表实现 \u0026#34;\u0026#34;\u0026#34; contents = args[0] # 传入的数据集二维数组格式 table = args[1] # 配置中的表名 config = args[3] # 相关的配置字典{\u0026#39;host\u0026#39;,\u0026#39;port\u0026#39;,\u0026#39;user\u0026#39;,\u0026#39;password\u0026#39;,\u0026#39;db\u0026#39;} # 插入你的写入数据逻辑代码 在任意的仪表盘开发界面中 \u0026ldquo;模板\u0026rdquo; \u0026ndash;\u0026gt; 点击上传图标, 将这个python文件上传即可 新建数据源, 驱动填写之前上传过的文件名, 比如我们这个是diy_conn, 其它参数按照你自定义的需求填写, 会自动传入你的自定义函数,之后你可以正常使用这个自定义数据源了 如果你对python不熟悉, 也可咨询客服按需定制, 你只需上传即可使用\n"},{"id":33,"href":"/docs/3.%E5%9B%BE%E5%BD%A2%E5%BC%80%E5%8F%91/Echarts%E7%BB%84%E4%BB%B6/","title":"Echarts组件","section":"3.图形开发","content":" 应用场景 # Smartchart提供了很多通用的图形,你可以在商店中直接使用 如果要个性化,需要你进行自定义,比如你可能需要在同一个图上展示柱形图和线性图\n开发前建意先观看视屏, 了解基础说明, 视屏有点老和现在界面不一样, 目前很多功能已经做成可视化配置, 理解过程即可, 具体以文档为准\nSmartchart数据库与图形的对话 Smartchart图形开发一 Smartchart图形开发二 获取原生echarts图形 # 首先我们在ECHART官网可能找一个你喜欢的图形, 如下简单柱形图链接: 打开我们可以看对应的option:\noption = { xAxis: { type: \u0026#39;category\u0026#39;, data: [\u0026#39;Mon\u0026#39;, \u0026#39;Tue\u0026#39;, \u0026#39;Wed\u0026#39;, \u0026#39;Thu\u0026#39;, \u0026#39;Fri\u0026#39;, \u0026#39;Sat\u0026#39;, \u0026#39;Sun\u0026#39;] }, yAxis: { type: \u0026#39;value\u0026#39; }, series: [{ data: [120, 200, 150, 80, 70, 110, 130], type: \u0026#39;bar\u0026#39; }] }; 转化为smartchart图形 # 复制到Smartchart图形编辑器， 点击菜单工具\u0026ndash;\u0026gt;转化为smartchart， 会自动进行初步转化 接下来我们就进行下改造, 请注意对比, 你只需照着复制即可\nlet dataset = __dataset__ //传入dataset let legend_label = ds_rowname(dataset) //可选, 自动获取legend let xlabel = dataset[0].splice(1) //x轴的标签列 dataset = ds_createMap(dataset) //转化成KV格式 //初始化series let series=[]; series.push({ data: dataset[legend_label[0]], //对应的第一个图列 type: \u0026#39;bar\u0026#39; }); series.push({ data: dataset[legend_label[1]], //对应的第二个图列 type: \u0026#39;line\u0026#39; }); option__name__ = { xAxis: { type: \u0026#39;category\u0026#39;, data: xlabel //X轴的标签 }, yAxis: { type: \u0026#39;value\u0026#39; }, series:series, }; charts.push(myChart__name__); 这样一个柱形+线性图就出来了\n当然一个图形还有很多其它的元素, 比如标题, legend, 等等 更多option的配置项, 可以点击”！“号图标查看，你可以直接参考echarts的设定， 完全一样！！\n以下我们做了些简单的修改\noption__name__ = { title: { text: \u0026#39;自定义图示例\u0026#39;, left: \u0026#39;center\u0026#39; }, //定义标题的显示 tooltip: { trigger: \u0026#39;item\u0026#39;, formatter: \u0026#39;{a} \u0026lt;br/\u0026gt;{b} : {c}\u0026#39; //鼠标移动提示的格式 }, legend: { left: \u0026#39;left\u0026#39;, data: legend_label }, //定义图例的显示 xAxis: { type: \u0026#39;category\u0026#39;, data: xlabel }, //定义X轴的显示 yAxis: { type: \u0026#39;value\u0026#39; }, //图例定义 series:series, }; //关于自动化series, 可以参考以下代码 var series =[]; for (let i=1;i\u0026lt;dataset[0].length;i++){ series.push({type: \u0026#39;bar\u0026#39;}) } 是不是非常简单 Smartchart让你使用echarts没有门槛\nTIPS: # 如果你在图形编辑器中可以显示图形， 但是保存后在dashboard中无法， 首先检查下所有的mychart, option是否都有转化成带__name__, 如果都有，可能原因是你的代码中有mychart.setoption， 这样你可以在代码下方加上myChart__name__.setOption(option__name__); 如果你在开发界面的仪表盘能看到图形显示，但预览仪表盘时，不显示图形，一般都是因为你图形代码中js结束需加分号(;)的地方没有添加导致的 "},{"id":34,"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/","title":"删除容器","section":"4.布局说明","content":"对于仪表盘中不再使用的数据集，你可能会考虑删除 首先smartchart推荐你不做删除，因为你可以保留他， 当你下次有新增数据集的需求时再拿出来 所以优先推荐使用隐藏的方法,你可以在数据集编辑界面找到他 如果你实在需要删除，可以在“报表”界面先中不需要容器后，选中删除，后保存\n"},{"id":35,"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/","title":"筛选器指南","section":"5.参数及联动钻取","content":" 通用实现方式 # SMARTCHART实现筛选最简单的方法只需要配一个控件即可:\n建立一个筛选清单数据集, 自动获取筛选的列表,那么可以这么写\nselect xxxx as city from tablename..... -- 则会生成一个如下的数据集: [[\u0026#39;city\u0026#39;],[选项1],[选项2],..] 良好的习惯, 先保存在数据集 然后在筛选器数据集中的js编辑器(图形编辑器),填下如下代码:\n//如要要美化, 自已加样式, 只要保证id=\u0026#34;id_select__name__\u0026#34; let dataset=__dataset__; let table =\u0026#39;\u0026lt;span\u0026gt;标题\u0026lt;/span\u0026gt;\u0026lt;select id=\u0026#34;id_select__name__\u0026#34;\u0026gt;\u0026#39;; table = table + \u0026#39;\u0026lt;option value=\u0026#34;\u0026#34; selected\u0026gt;----\u0026lt;/option\u0026gt;\u0026#39;; for(let i=1;i\u0026lt;dataset.length;i++){ table = table + \u0026#39;\u0026lt;option\u0026gt;\u0026#39; + dataset[i][0] + \u0026#39;\u0026lt;/option\u0026gt;\u0026#39;; } table = table + \u0026#39;\u0026lt;/select\u0026gt;\u0026lt;/div\u0026gt;\u0026lt;/div\u0026gt;\u0026#39; dom__name__.innerHTML=table; 这个时候你已经可以看到筛选器了\n现在我们来设定联动效果\n假设需要被筛选的数据集的SQL这样写,数据集的序号是0 那么在需要被联动的数据集中,如使用pcity做为参数写查询, 比如:\nselect xx, xx, xx from tablename /* where xx = \u0026#39;$pcity\u0026#39; */ 现在回到我们筛选器数据集,点击标题的位置, 我们需要使0号图形被筛选器联动, 设置如下即可: 然后你就可以看到筛选效果了, 非常的简单方便, 需要多个图形被联动, 只需用逗号分隔即可 比如: 0, 2, 4\n筛选器的美化请学习样式调整\n"},{"id":36,"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/","title":"上传资源文件","section":"低代码开发","content":"点击 模板开发 中的菜单即可上传你的资源文件, 如css, js, 图片等 视屏介绍说明 常规上传 # 可直接上传单个文件或zip包上传, 注意zip包中不可以有中文文件名 上传后会提示引用路径为/static/custom/仪表盘ID/\u0026hellip;\n上传为共享资源 # 可把资源打包为zip文件, 上传名以usr_开头, 如usr_tp.zip 上传完后不会有路径提示, 引用路径为/static/custom/usr_tp/\u0026hellip;.\n上传自定义数据源或jar包 # 上传后不会有路径提示\n"},{"id":37,"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/","title":"实战大屏模板转化","section":"6.进阶开发 Pro","content":" 应用场景 # 已有开发好的非smartchart静态大屏模板(这种模板非常多, 不要上当) 对js, css及smartchart已有初始了解 业务需求展示有合适的模板, 变化不大 如何使用 # 请观看系列视屏, 相信人人都会 头条视屏: 大屏模板转化系列 B站视屏: 大屏模板转化系列\n"},{"id":38,"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/","title":"单页面嵌入","section":"7.报表嵌入","content":" 嵌入报表 # 与单点登录类似, 单点登录用于直接登录到平台访问报表 但对于只嵌入报表, 用此方法更合适(需升级到5.3.11以上)\n嵌入的url: \u0026#39;/echart/?type={reportName}\u0026amp;visitor={visitor}\u0026amp;token={token}\u0026amp;stamp={stamp}\u0026#39; 参数说明： reportName： 报表名或报表ID visitor: 用户名（在smartchart平台中管理） stamp: 时间戳(1970年1月1日到生成时间的毫秒数) token: 采用sha1加密, token=SHA1(链接秘钥+stamp+visitor+reportName) 用户名和秘钥设定参考 数据服务API的config文件\n同时你需要将visitor加入到对应的报表权限查看访问\npython样列 # 以下为python版的url生成样列，你可以转化成你对应的开发语言\nimport time import hashlib import os SMART_CHART_URL = \u0026#39;http://127.0.0.1:8000\u0026#39; reportID = \u0026#39;报表ID\u0026#39; LOGIN_URL = SMART_CHART_URL + \u0026#39;/echart/?type={reportID}\u0026amp;visitor={visitor}\u0026amp;token={token}\u0026amp;stamp={stamp}\u0026#39; TOKEN = 链接秘钥 def get_smarturl(username, reportName): stamp = int(time.time() * 1000) visitor = username res = TOKEN + str(stamp) + visitor + reportID token = hashlib.sha1(res.encode(\u0026#39;utf-8\u0026#39;)).hexdigest() VISIT_DICT = { \u0026#34;visitor\u0026#34;: id, \u0026#34;stamp\u0026#34;: stamp, \u0026#34;token\u0026#34;: token, \u0026#34;reportID\u0026#34;: reportName } # 拼接好的url,直接访问 visit_url = LOGIN_URL.format(** VISIT_DICT) return visit_url 数据权限加密方法 # 如果你需要对用户进行一些数据权限控制, 可以避免用户越权访问 可以通过传入参数\u0026#34;id\u0026#34;, 如/echart/?type=xxx\u0026amp;visitor=xx\u0026amp;token=xx\u0026amp;stamp=xxxxx\u0026amp;id=xxx 后台会把这个id转化为参数名\u0026#34;_id\u0026#34;给对应的查询来进行数据权限控制 加密参数需把id加入, 例如id=john 那么 token=SHA1(链接秘钥+stamp+visitor+reportName+id) 全参数加密方法 # 如果需要将参数也加入认证中, 为保持兼容性, 我们把param这个参数改为params(具体参考参数文档中param的写法) \u0026#39;/echart/?type={reportName}\u0026amp;visitor={visitor}\u0026amp;token={token}\u0026amp;stamp={stamp}\u0026amp;params=xxxx\u0026#39; 加密参数把params加入, 例如params为 {\u0026#34;a\u0026#34;:\u0026#34;1\u0026#34;,\u0026#34;b\u0026#34;:2\u0026#34;} res = TOKEN + str(stamp) + visitor + reportName + \u0026#39;{\u0026#34;a\u0026#34;:\u0026#34;1\u0026#34;,\u0026#34;b\u0026#34;:2\u0026#34;}\u0026#39; "},{"id":39,"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/","title":"第一个仪表盘","section":"1.基础操作","content":"由于版本的变更, 一些图标可能会有一些变化, 但位置无太大的变化\n新建仪表盘 # 在开发模式下，滑动“开发管理” -\u0026gt;\u0026ldquo;仪表盘\u0026rdquo;-\u0026gt; \u0026ldquo;新增Dashboard\u0026rdquo; 填写相应信息后点击“保存” 点击进入仪表盘开发, 注意点击 \u0026ldquo;E\u0026rdquo; 字!! 点击新增(注意拖拽布局功能为PRO版本, 后续免费版本中将无法使用), 如果你坚持使用免费版本功能, 请使用新增栅格组件, 具体布局方式参考 数据集编辑 # 点开“数据集” - 输入以下SQL后，点击“保存并刷新”, 关闭数据集编辑界面 select H1 as heroname, sum(qty) as 出场数 from smartdemo2 group by H1 order by sum(qty) desc 图形编辑 # 点开“图形编辑” 点击“图形”，可以选择基础图形, 也可以使用图形商店,第一次使用可能要你进行登记，按提示操作即可， 在商店中找到合适的图形点击，会自动复制到剪贴板 贴粘到图形编辑器后，点击保存， 关闭图形编辑框 拖拽布局 # 重复以上步骤，再新增一个， 你可以使用拖拽的方式, 移动到不同的地方 "},{"id":40,"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/","title":"数据集懒加载","section":"数据集形态","content":" 应用场景 # 类似于前后端开发, 后端会提供一些接口给前端, 但前端不一定需要在一打开页面就进行查询接口, 而是当有需要时再查询, 比如数据下载, 只有当用户有下载需求时再刷新数据 再比如有些与后台的数据联动, 我们只需要第一次加载时只显示第一层级, 点击时再加载其它层级 开启数据集懒加载 # 在仪表盘\u0026quot;新增\u0026quot;\u0026ndash;\u0026gt;\u0026ldquo;懒加载数据集\u0026rdquo; 当打开仪表盘时, 此数据集不会被加载\n应用 # 刷新数据 # 你可以随时手动触发数据集的刷新, 比如懒加载的数据集序号为0, 你可在需要触发刷新的JS代码段调用ds_refresh(0), 即可刷新0号数据集并执行0号数据集图形中的JS代码\n使用数据 # 当没有修改过懒加载数据集的图形时,默认的全局变量为\u0026quot;data序号\u0026quot;, 例如懒加载数据集序号为0, 你可在任意数据集的图形或模板中使用data0来获取数据集刷新后的数据\n数据处理 # 在有些场景, 你可能需要对懒加载的数据进行一些处理, 你可以在懒加载的图形中自定义处理逻辑, 比如我们需要把数据转化成vue常用的格式, 然后给vue的变量赋值:\nlet dataset = __dataset__; dataset = ds_createMap_all(dataset); vapp.ds1 = dataset; //赋值给vue 参数传递 # 在有一些场景,需要在前端获取参数, 之后触发数据查询, 比如筛选项. 你可以使用ds_setParam(\u0026lsquo;参数名\u0026rsquo;, 参数值)设定参数, 比如刷新1号数据集\nds_setParam(\u0026#39;city\u0026#39;, \u0026#39;顺德\u0026#39;); ds_setParam(\u0026#39;province\u0026#39;, \u0026#39;广东\u0026#39;); ds_refresh(1); "},{"id":41,"href":"/docs/3.%E5%9B%BE%E5%BD%A2%E5%BC%80%E5%8F%91/HTML%E7%BB%84%E4%BB%B6/","title":"Html组件","section":"3.图形开发","content":" 应用场景 # 输入控件,如输入框,筛选器,多选,按钮\u0026hellip; 显示组件, 文本, 图片, 视屏\u0026hellip; 表格组件 如果你还不熟悉html, 建意先花几分钟看下文档, 推荐 HTML基础 实际应用中有不熟悉的组件, 你都可以通过baidu搜索到, 如时间选择器 html组件转化为smartchart组件 # 比如我们要实现一个有多选项和按钮的网页元素 从各大搜索平台上我们可以找到html的代码是：\n\u0026lt;label\u0026gt;\u0026lt;input type=\u0026#34;checkbox\u0026#34;\u0026gt;孙尚香\u0026lt;/label\u0026gt; ..... \u0026lt;button id=\u0026#39;id_select0\u0026#39;\u0026gt;提交\u0026lt;/button\u0026gt; 那么我们可以直接在图形编辑器写上\nlet dataset=__dataset__; let table = \u0026#39;\u0026#39;; table = `\u0026lt;label\u0026gt;\u0026lt;input type=\u0026#34;checkbox\u0026#34;\u0026gt;孙一香\u0026lt;/label\u0026gt; \u0026lt;label\u0026gt;\u0026lt;input type=\u0026#34;checkbox\u0026#34;\u0026gt;孙二香\u0026lt;/label\u0026gt; \u0026lt;label\u0026gt;\u0026lt;input type=\u0026#34;checkbox\u0026#34;\u0026gt;孙三香\u0026lt;/label\u0026gt;` table = table + \u0026#34;\u0026lt;button id=\u0026#39;id_select0\u0026#39;\u0026gt;提交\u0026lt;/button\u0026gt;\u0026#34; dom__name__.innerHTML=table; 但是由于我们是要通过传入的数据动态变化的，所以只需要做简单修改\nlet dataset=__dataset__; let table = \u0026#39;\u0026#39;; for (let i=1;i\u0026lt;dataset.length;i++){ table = `${table}\u0026lt;label\u0026gt;\u0026lt;input type=\u0026#34;checkbox\u0026#34;/\u0026gt;${dataset[i][0]}\u0026lt;/label\u0026gt; ` } table = table + \u0026#34;\u0026lt;button id=\u0026#39;id_select__name__\u0026#39;\u0026gt;提交\u0026lt;/button\u0026gt;\u0026#34; dom__name__.innerHTML=table; 所有html你都可以进行转化成smartchart组件， 你可以通过学习”万能表格系列视屏“ 来了解通用组件开发 第一波 第二波 第三波\n"},{"id":42,"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/","title":"组件自定义联动","section":"5.参数及联动钻取","content":" 应用场景 # Smartchart对于单项筛选有通用的组件， 可以直接配置即可，但对于个性化的筛选，需要你进行一些简单的定制化，以下就针对多项筛选联动的需求来介绍如何定制化你的筛选联动效果 通过此例,你可以了解如何自定义任意的联动效果 样列参考 # 以我们内置的仪表盘为例，\n第一步，新建一个图形组件\n第二步，在新的数据集中编写查询\nselect distinct H1 as heroname from smartdemo2 limit 10 第三步，编辑此数据集的图形，可复制以下代码\n//select distinct xx from tablename let dataset=__dataset__; let table = \u0026#39;\u0026#39;; for (let i=1;i\u0026lt;dataset.length;i++){ table = `${table}\u0026lt;label\u0026gt;\u0026lt;input name=\u0026#34;select__name__\u0026#34; type=\u0026#34;checkbox\u0026#34; value=\u0026#34;${dataset[i][0]}\u0026#34; /\u0026gt;${dataset[i][0]}\u0026lt;/label\u0026gt; `; } table = table + \u0026#34;\u0026lt;button id=\u0026#39;id_select__name__\u0026#39;\u0026gt;提交\u0026lt;/button\u0026gt;\u0026#34;; dom__name__.innerHTML=table; $(\u0026#39;#id_select__name__\u0026#39;).click( function(){ let res = []; $(\u0026#34;input[name=\u0026#39;select__name__\u0026#39;]:checked\u0026#34;).each(function(i){ res.push(\u0026#34;\u0026#39;\u0026#34; + $(this).val() + \u0026#34;\u0026#39;\u0026#34;); }); ds_setParam(\u0026#39;H1\u0026#39;,res.toString()); //参数赋值 ds_refresh(1); //刷新1号图形 } ) 第四步，在你要联动刷新的目标数据集中增加代码\nselect H1 as heroname, sum(qty) as 出场数 from smartdemo2 where 1=1 /* and H1 in ($H1) */ group by H1 order by sum(qty) desc 这样就完成了，任何其他需求，都可以采用类似方法自定义\nTIPS 如果这个点击的图形有可能被其它图形点击联动或存在定时刷新,需要加入如下unbind否则会触发多次刷新 $(\u0026rsquo;#id_select__name__\u0026rsquo;).unbind(\u0026lsquo;click\u0026rsquo;).click(\u0026hellip;..\n如需取消联动,恢复到初始效果, 你需要删除参数, 如: delete filter_param[\u0026lsquo;H1\u0026rsquo;]\n"},{"id":43,"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/","title":"边框与装饰","section":"低代码开发","content":" 观看视屏 # 边框与装饰说明1 边框与背景说明2\n边框/装饰/背景(购买专业版提供使用方法) # "},{"id":44,"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/","title":"备份恢复及版本","section":"6.进阶开发 Pro","content":" 应用场景 # 本地仪表盘的备份恢复，版本管理 开发测试生产机之间的同步 具体使用方法请观看视屏 版本控制使用说明视屏\n使用方法 # 快速备份 # 可以在模板-\u0026gt;点击如下图标， 完成快速备份（注意会覆盖历史）， 备份号统一为：SNAPSHOT 指定备份 # 你也可以在设定-\u0026gt;备份恢复 中进行按版本备份 查询备份 # 当不输入KEY值， 点击 本地备份时，可以查询此仪表盘已有的备份 备份恢复 # 备份可以在任意的仪表盘中进行恢复，如果是当前仪表盘， 仅输入KEY即可，比如：V01, 如果是跨仪表盘恢复， KEY需要带上仪表盘的编号如13_V01\n备份恢复参数说明 # 可以支持多种恢复模式, 只需要在KEY前面加上前缀即可， 如FORCEV01, FORCE13_V01.. FORCE: 删除自身所有数据集及高级设定，模板等，完全恢复备份 DATASET：只更新数据集及图形,模板，适用于测试上线正式 CHART: 只更新图形及模板，适用于前端变更上线\n跨服务器间同步 # 具体方法购买专业版本后提供\n企业如何在使用最少资源做出最专业的可视化项目 # 前提条件: # 公司内部有技术人员(熟悉数据, 会写SQL) 服务器安装smartchart专业版 开发流程: # 由于公司内部人员是对业务最熟悉, 一般也都是后台数据管理相关的人员, 一般不太会有专职的前端开发和UI 所以数据开发人员可以使用smartchart开发仪表盘数据集, 并使用拖拽功能完成一个粗糙一点的框架和图形设计 一般情况下已经可以满足数据可视化的需求\n如果需要达到更专业的可视化效果, 可以外包前端/UI或在smartchart社区咨询, 由于需求变得非常简单 而前端开发又是一个通用技能, 可以使用非常廉价的费用获得最大的效果\n专业的事情专业来做, 才能达到效益最大化, 这是smartchart的设计理念 不管用什么工具, 在同等资源的投入下, 数据分析人员开发的可视化效果很难达到专业前端UI的效果 另外BI/数据开发人员的费用可是比前端高的, 也更稀缺\n前端开发只需本地安装smartchart, 而无需接触到公司数据库或数据接口, 开发完全解耦, 数据安全保障 smartchart可以将数据开发人员开发的仪表盘直接同步到前端开发的本地smartchart(仅会保留demo数据) 前端进行一些简单的美化工作即可, 无需对业务和数据进行理解, 花费的时间非常之少 前端开发完成后可以一键同步到smartchart服务端, 且可以只同步可视化部分 由于数据和展示是分离的, 所以数据开发和前端美化是可以同步进行 由于smartchart是一个平台化产品, 数据开发人员不熟悉前端也能在前端开发完成的基础上进行样式和图形的修改 "},{"id":45,"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/","title":"数据下载","section":"数据服务","content":" 应用场景: # 需要要下载数据集的数据到本地\n使用方法 # 仅需要录活使用ds_download这个函数, 你可以开发出非常个性化的下载功能\nds_download(name, dataset) 参数说明: name: 文件名称 dataset: 可以是二维数组也可以是字符串 样例: # 可在\u0026quot;模板\u0026quot; 中新建一个下载按钮, 并指定一个ID,如id_down1, 拖拽到你需要的位置 在任意一个图形开发或js代码段中加入以下代码即可\n$(\u0026#39;#id_down1\u0026#39;).click(()=\u0026gt;{ ds_download(\u0026#39;报表数据.csv\u0026#39;, dataset); }); 这样就可以实现点击按钮下载数据了\n"},{"id":46,"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/","title":"第一个复杂报表","section":"1.基础操作","content":" 新建仪表盘 # 在开发模式下，滑动“开发管理” -\u0026gt;\u0026ldquo;仪表盘\u0026rdquo;-\u0026gt; \u0026ldquo;新增Dashboard\u0026rdquo; 填写相应信息后点击“保存” 点击进入仪表盘开发, 注意点击 \u0026ldquo;E\u0026rdquo; 字!! 点击新增\u0026ndash;\u0026gt;复杂报表 数据集编辑 # 点开“数据集” 输入以下SQL后，点击“保存并刷新”, 关闭数据集编辑界面 select H1 as 英雄名称, sum(qty) as 英雄1出场数 from smartdemo2 group by H1 order by sum(qty) desc; select count(1) as 总出场数 from smartdemo2 报表页面开发 # 和excel一样, 编辑相应表格 点击\u0026quot;数据集图标\u0026quot;(再次点击隐藏), 显示数据集字段名, 选中单元格, 单击字段名填入 点击\u0026quot;获取数据\u0026quot;, 可对真实数据调整样式 点击\u0026quot;保存\u0026quot; 点击\u0026quot;预览\u0026quot;, 可查看最终效果 导入EXCEL/WPS开发的模板 # 你也可直接导入excel或wps开发好的模板, 点击左下方的上传即可\n关于自动填充方式 # 填充方向 # 默认的填充方向, 是按列方向向下填充 如果需要按行方向向右填充, 可在单元格字段标识后面加上__, 如下:\n#df0.英雄名称__ 格式填充 # 默认不会填充格式, 采用单元格自身的格式 如果需要自动采用\u0026quot;单元格字段标识\u0026quot;的格式, 可在单元格字段标识后面加上!, 如下:\n#df0.英雄名称! 格式填充在数据预览不会生效, 仅在报表预览及用户模式下生效\n如果需要同时修改填充方向, 可标识如下:\n#df0.英雄名称!__ 当然我们还有更多可定制的功能, 自行探索吧 也可购买专业版本解锁高级用法\n"},{"id":47,"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/","title":"调试日志","section":"3.图形开发","content":" 关于页面日志查看 # 大家可能比较熟悉使用F12来查看网页日志, 但有的同学会觉得这不够方便, 所以 smartchart加入了可以页面直接显示日志的功能\n在仪表盘中显示 # 你只需要点击如下菜单, 即可切换是否显示日志 当在刷新页面或执行时, 日志将直接显示在右下角中, 而且还能显示出对应出错的图表序号 在图形中显示 # smartchart基于python的使用习惯, 重定义的专用的日志打印函数print 你可以在图形编辑器中使用些函数即可打印日志 比如看看鼠标放在echarts图上params, 在编辑界面和console中都能看到日志, 方便你进行调试 更多应用 # 不仅仅这些, 你可能会想写太多打印日志, 上线了不好 smartchart已为你想到这些, 如果你在仪表盘中没有开启日志显示, print函数是不会打印任何日志\n有了仪表盘日志显示, 我们还能做更多的事情, 比如实时显示你拖拽的坐标, 让你精确定位 "},{"id":48,"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/","title":"样式快速上手","section":"低代码开发","content":" 样式操作: # 要想大屏做得好, 样式要写得好 可是我们不是前端的同学也能写样式么 当然可以, 相信你观看完以下视屏即可\n快速上手样式开发\n基础样式入门: # CSS介绍 # CSS（Cascading Style Sheet，层叠样式表)定义如何显示HTML元素。 当浏览器读到一个样式表，它就会按照这个样式表来对文档进行格式化（渲染）。\nCSS语法 # CSS实例 每个CSS样式由两个组成部分：选择器和声明。声明又包括属性和属性值。每个声明之后用分号结束。 CSS注释\n/*这是注释*/ 注释是代码之母, smartchart编辑中你可以使用CTRL+/快捷注释\nCSS的几种引入方式 行内样式 行内式是在标记的style属性中设定CSS样式。不推荐大规模使用。\n\u0026lt;p style=\u0026#34;color: red\u0026#34;\u0026gt;Hello world.\u0026lt;/p\u0026gt; 内部样式 嵌入式是将CSS样式集中写在网页的标签对的标签对中。格式如下：\n\u0026lt;head\u0026gt; \u0026lt;style\u0026gt; p{ background-color: #2b99ff; } \u0026lt;/style\u0026gt; \u0026lt;/head\u0026gt; 外部样式 外部样式就是将css写在一个单独的文件中\n\u0026lt;link href=\u0026#34;mystyle.css\u0026#34; rel=\u0026#34;stylesheet\u0026#34; type=\u0026#34;text/css\u0026#34;/\u0026gt; CSS选择器 # 基本选择器\n/*元素选择器*/ p {color: \u0026#34;red\u0026#34;;} /*ID选择器*/ #i1 { background-color: red; } /*类选择器*/ .c1 { font-size: 14px; } p .c1 { color: red; } 注意： 样式类名不要用数字开头（有的浏览器不认）。 标签中的class属性如果有多个，要用空格分隔。\n通用选择器\n* { color: white; } 组合选择器\n/*后代选择器*/ /*li内部的a标签设置字体颜色*/ li a { color: green; } /*儿子选择器*/ /*选择所有父级是 \u0026lt;div\u0026gt; 元素的 \u0026lt;p\u0026gt; 元素*/ div\u0026gt;p { font-family: \u0026#34;Arial Black\u0026#34;, arial-black, cursive; } /*毗邻选择器*/ /*选择所有紧接着\u0026lt;div\u0026gt;元素之后的\u0026lt;p\u0026gt;元素*/ div+p { margin: 5px; } /*弟弟选择器*/ /*i1后面所有的兄弟p标签*/ #i1~p { border: 2px solid royalblue; } /*属性选择器*/ /*用于选取带有指定属性的元素。*/ p[title] { color: red; } /*用于选取带有指定属性和值的元素。*/ p[title=\u0026#34;213\u0026#34;] { color: green; } /*找到所有title属性以hello开头的元素*/ [title^=\u0026#34;hello\u0026#34;] { color: red; } /*找到所有title属性以hello结尾的元素*/ [title$=\u0026#34;hello\u0026#34;] { color: yellow; } /*找到所有title属性中包含（字符串包含）hello的元素*/ [title*=\u0026#34;hello\u0026#34;] { color: red; } /*找到所有title属性(有多个值或值以空格分割)中有一个值为hello的元素：*/ [title~=\u0026#34;hello\u0026#34;] { color: green; } 分组和嵌套\n分组 当多个元素的样式相同的时候，我们没有必要重复地为每个元素都设置样式，我们可以通过在多个选择器之间使用逗号分隔的分组选择器来统一设置元素样式。 例如： div, p { color: red; } 上面的代码为div标签和p标签统一设置字体为红色。 嵌套 多种选择器可以混合起来使用，比如：.c1类内部所有p标签设置字体颜色为红色。 .c1 p { color: red; } 伪类选择器\n/* 未访问的链接 */ a:link { color: #FF0000 } /* 鼠标移动到链接上 */ a:hover { color: #FF00FF } /* 选定的链接 */ a:active { color: #0000FF } /* 已访问的链接 */ a:visited { color: #00FF00 } /*input输入框获取焦点时样式*/ input:focus { outline: none; background-color: #eee; } 伪元素选择器\n/*first-letter*/ /*常用的给首字母设置特殊样式：*/ p:first-letter { font-size: 48px; color: red; } before /*在每个\u0026lt;p\u0026gt;元素之前插入内容*/ p:before { content:\u0026#34;*\u0026#34;; color:red; } after /*在每个\u0026lt;p\u0026gt;元素之后插入内容*/ /*before和after多用于清除浮动。*/ p:after { content:\u0026#34;[?]\u0026#34;; color:blue; } 选择器的优先级 # CSS继承 继承是CSS的一个主要特征，它是依赖于祖先-后代的关系的。继承是一种机制，它允许样式不仅可以应用于某个特定的元素，还可以应用于它的后代。例如一个body定义了的字体颜色值也会应用到段落的文本中。 body { color: red; } 此时页面上所有标签都会继承body的字体颜色。然而CSS继承性的权重是非常低的，是比普通元素的权重还要低的0。 我们只要给对应的标签设置字体颜色就可覆盖掉它继承的样式。 p { color: green; } 选择器的优先级 我们上面学了很多的选择器，也就是说在一个HTML页面中有很多种方式找到一个元素并且为其设置样式，那浏览器根据什么来决定应该应用哪个样式呢？ 其实是按照不同选择器的权重来决定的，具体的选择器权重计算方式如下图： 除此之外还可以通过添加 !important方式来强制让样式生效，但并不推荐使用。 因为如果过多的使用!important会使样式文件混乱不易维护。 万不得已可以使用!important\nCSS属性相关 # 宽和高\nwidth属性可以为元素设置宽度。 height属性可以为元素设置高度。 块级标签才能设置宽度，内联标签的宽度由内容来决定。 字体属性\n文字字体 font-family可以把多个字体名称作为一个“回退”系统来保存。如果浏览器不支持第一个字体，则会尝试下一个。浏览器会使用它可识别的第一个值。 简单实例： body { font-family: \u0026#34;Microsoft Yahei\u0026#34;, \u0026#34;微软雅黑\u0026#34;, \u0026#34;Arial\u0026#34;, sans-serif } 字体大小 p { font-size: 14px; } 如果设置成inherit表示继承父元素的字体大小值。 字重（粗细） font-weight用来设置字体的字重（粗细）。 值描述normal默认值，标准粗细bold粗体bolder更粗lighter更细100~900设置具体粗细，400等同于normal，而700等同于boldinherit继承父元素字体的粗细值 文本颜色 color 颜色是通过CSS最经常的指定： 十六进制值 - 如: ＃FF0000 一个RGB值 - 如: RGB(255,0,0) 颜色的名称 - 如: red 还有rgba(255,0,0,0.3)，第四个值为alpha, 指定了色彩的透明度/不透明度，它的范围为0.0到1.0之间。 文字属性\n文字对齐 text-align 属性规定元素中的文本的水平对齐方式。 值描述left左边对齐 默认值right右对齐center居中对齐justify两端对齐 文字装饰 text-decoration 属性用来给文字添加特殊效果。 值描述none默认。定义标准的文本。underline定义文本下的一条线。overline定义文本上的一条线。line-through定义穿过文本下的一条线。inherit继承父元素的text-decoration属性的值。 常用的为去掉a标签默认的自划线： a { text-decoration: none; } 首行缩进 将段落的第一行缩进 32像素： p { text-indent: 32px; } 背景属性\n/*背景颜色*/ background-color: red; /*背景图片*/ background-image: url(\u0026#39;1.jpg\u0026#39;); /* 背景重复 repeat(默认):背景图片平铺排满整个网页 repeat-x：背景图片只在水平方向上平铺 repeat-y：背景图片只在垂直方向上平铺 no-repeat：背景图片不平铺 */ background-repeat: no-repeat; /*背景位置*/ background-position: left top; /*background-position: 200px 200px;*/ 支持简写： background:#336699 url(\u0026#39;1.png\u0026#39;) no-repeat left top; 使用背景图片的一个常见案例就是很多网站会把很多小图标放在一张图片上，然后根据位置去显示图片。减少频繁的图片请求。 边框\n/*边框属性*/ border-width border-style border-color #i1 { border-width: 2px; border-style: solid; border-color: red; } /*通常使用简写方式：*/ #i1 { border: 2px solid red; } /*边框样式 值描述none无边框。dotted点状虚线边框。dashed矩形虚线边框。solid实线边框。*/ /*除了可以统一设置边框外还可以单独为某一个边框设置样式，如下所示：*/ #i1 { border-top-style:dotted; border-top-color: red; border-right-style:solid; border-bottom-style:dotted; border-left-style:none; } /*border-radius属性能实现圆角边框的效果。*/ /*将border-radius设置为长或高的一半即可得到一个圆形。*/ display属性\n用于控制HTML元素的显示效果。 值意义display:\u0026#34;none\u0026#34;HTML文档中元素存在，但是在浏览器中不显示。一般用于配合JavaScript代码使用。display:\u0026#34;block\u0026#34;默认占满整个页面宽度，如果设置了指定宽度，则会用margin填充剩下的部分。display:\u0026#34;inline\u0026#34;按行内元素显示，此时再设置元素的width、height、margin-top、margin-bottom和float属性都不会有什么影响。display:\u0026#34;inline-block\u0026#34;使元素同时具有行内元素和块级元素的特点。 display:\u0026#34;none\u0026#34;与visibility:hidden的区别： visibility:hidden: 可以隐藏某个元素，但隐藏的元素仍需占用与未隐藏之前一样的空间。也就是说，该元素虽然被隐藏了，但仍然会影响布局。 display:none: 可以隐藏某个元素，且隐藏的元素不会占用任何空间。也就是说，该元素不但被隐藏了，而且该元素原本占用的空间也会从页面布局中消失。 CSS盒子模型\nmargin: 用于控制元素与元素之间的距离；margin的最基本用途就是控制元素周围空间的间隔，从视觉角度上达到相互隔开的目的。 padding: 用于控制内容与边框之间的距离； Border(边框): 围绕在内边距和内容外的边框。 Content(内容): 盒子的内容，显示文本和图像。 margin外边距 .margin-test { margin-top:5px; margin-right:10px; margin-bottom:15px; margin-left:20px; } 推荐使用简写： .margin-test { margin: 5px 10px 15px 20px; } 顺序：上右下左 常见居中： .mycenter { margin: 0 auto; } padding内填充 .padding-test { padding-top: 5px; padding-right: 10px; padding-bottom: 15px; padding-left: 20px; } 推荐使用简写： .padding-test { padding: 5px 10px 15px 20px; } 顺序：上右下左 补充padding的常用简写方式： 提供一个，用于四边； 提供两个，第一个用于上－下，第二个用于左－右； 如果提供三个，第一个用于上，第二个用于左－右，第三个用于下； 提供四个参数值，将按上－右－下－左的顺序作用于四边； float\n在 CSS 中，任何元素都可以浮动。 浮动元素会生成一个块级框，而不论它本身是何种元素。 关于浮动的两个特点： 浮动的框可以向左或向右移动，直到它的外边缘碰到包含框或另一个浮动框的边框为止。 由于浮动框不在文档的普通流中，所以文档的普通流中的块框表现得就像浮动框不存在一样。 三种取值 left：向左浮动 right：向右浮动 none：默认值，不浮动 overflow溢出属性\n值描述visible默认值。内容不会被修剪，会呈现在元素框之外。hidden内容会被修剪，并且其余内容是不可见的。scroll内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。auto如果内容被修剪，则浏览器会显示滚动条以便查看其余的内容。inherit规定应该从父元素继承 overflow 属性的值。 overflow（水平和垂直均设置） overflow-x（设置水平方向） overflow-y（设置垂直方向） 定位（position）\nstatic static 默认值，无定位，不能当作绝对定位的参照物，并且设置标签对象的left、top等值是不起作用的的。 relative（相对定位） 相对定位是相对于该元素在文档流中的原始位置，即以自己原始位置为参照物。有趣的是，即使设定了元素的相对定位以及偏移值，元素还占有着原来的位置，即占据文档流空间。对象遵循正常文档流，但将依据top，right，bottom，left等属性在正常文档流中偏移位置。而其层叠通过z-index属性定义。 注意：position：relative的一个主要用法：方便绝对定位元素找到参照物。 absolute（绝对定位） 定义：设置为绝对定位的元素框从文档流完全删除，并相对于最近的已定位祖先元素定位，如果元素没有已定位的祖先元素，那么它的位置相对于最初的包含块（即body元素）。元素原先在正常文档流中所占的空间会关闭，就好像该元素原来不存在一样。元素定位后生成一个块级框，而不论原来它在正常流中生成何种类型的框。 重点：如果父级设置了position属性，例如position:relative;，那么子元素就会以父级的左上角为原始点进行定位。这样能很好的解决自适应网站的标签偏离问题，即父级为自适应的，那我子元素就设置position:absolute;父元素设置position:relative;，然后Top、Right、Bottom、Left用百分比宽度表示。 另外，对象脱离正常文档流，使用top，right，bottom，left等属性进行绝对定位。而其层叠通过z-index属性定义。 fixed（固定） fixed：对象脱离正常文档流，使用top，right，bottom，left等属性以窗口为参考点进行定位，当出现滚动条时，对象不会随着滚动。而其层叠通过z-index属性 定义。 注意点： 一个元素若设置了 position:absolute | fixed; 则该元素就不能设置float。这 是一个常识性的知识点，因为这是两个不同的流，一个是浮动流，另一个是“定位流”。但是 relative 却可以。因为它原本所占的空间仍然占据文档流。 在理论上，被设置为fixed的元素会被定位于浏览器窗口的一个指定坐标，不论窗口是否滚动，它都会固定在这个位置。 z-index\n#i2 { z-index: 999; } 设置对象的层叠顺序。 z-index 值表示谁压着谁，数值大的压盖住数值小的， 只有定位了的元素，才能有z-index,也就是说，不管相对定位，绝对定位，固定定位，都可以使用z-index，而浮动元素不能使用z-index z-index值没有单位，就是一个正整数，默认的z-index值为0如果大家都没有z-index值，或者z-index值一样，那么谁写在HTML后面，谁在上面压着别人，定位了元素，永远压住没有定位的元素。 从父现象：父亲怂了，儿子再牛逼也没用 opacity 用来定义透明效果。取值范围是0~1，0是完全透明，1是完全不透明。\n"},{"id":49,"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/","title":"数据填报","section":"数据服务","content":" 应用场景 # 收集用户端录入的数据 前端处理好的数据回写到任意系统 制做问卷系统 埋点应用 使用方法 # 新建一个懒加载数据集,填写内容格式如下: # 如果需将数据保存到对应的表名 dataset={ \u0026#34;table\u0026#34;:\u0026#34;表名\u0026#34; } 如需指定字段, 可如下方式填写 dataset={ \u0026#34;table\u0026#34;:\u0026#34;表名(字段1, 字段2)\u0026#34; } 在\u0026quot;模板\u0026quot;中编写录入组件代码, # 具体可参考视屏\n\u0026lt;h1 class=\u0026#34;smtdrag\u0026#34; id=\u0026#34;id_1648895680659\u0026#34;\u0026gt;数据填报\u0026lt;/h1\u0026gt; \u0026lt;div class=\u0026#34;smtdrag\u0026#34; id=\u0026#34;id_1648895855760\u0026#34;\u0026gt; \u0026lt;label\u0026gt;用户\u0026lt;/label\u0026gt;\u0026lt;input id=\u0026#34;id_visitor\u0026#34;\u0026gt; \u0026lt;/div\u0026gt; \u0026lt;div class=\u0026#34;smtdrag\u0026#34; id=\u0026#34;id_1648895859160\u0026#34;\u0026gt; \u0026lt;label\u0026gt;动作\u0026lt;/label\u0026gt;\u0026lt;input id=\u0026#34;id_action\u0026#34;\u0026gt; \u0026lt;/div\u0026gt; \u0026lt;div class=\u0026#34;smtdrag\u0026#34; id=\u0026#34;id_1648895956207\u0026#34;\u0026gt; \u0026lt;button id=\u0026#34;idbtn01\u0026#34;\u0026gt;提交\u0026lt;/button\u0026gt; \u0026lt;/div\u0026gt; 在\u0026quot;模板\u0026quot; 中编写JS代码 $(\u0026#39;#idbtn01\u0026#39;).click(function(){ //获取填写的数据 let visitor = $(\u0026#39;#id_visitor\u0026#39;).val(); let action = $(\u0026#39;#id_action\u0026#39;).val(); //拼接一个填写好的数组 let dataset = [visitor, action]; //上传填写的数据 //0:为上文新建的数据集序号, dataset:要写入的数据 print(ds_save(0, dataset)); }) 更多关于写入数据库的数据集格式说明 # //只写入一行数据, 样列如下: dataset = [\u0026#39;a\u0026#39;,\u0026#39;b\u0026#39;] //同时写入多行数据: dataset = [[], [\u0026#39;a1\u0026#39;,\u0026#39;b1\u0026#39;],[\u0026#39;a2\u0026#39;, \u0026#39;b2\u0026#39;]] //如果需要自动记录写入者用户名: dataset = [\u0026#39;$username\u0026#39;, \u0026#39;b\u0026#39;] mongodb写入方式\nds_save(0, {\u0026#34;h1\u0026#34;:123, \u0026#34;h2\u0026#34;:\u0026#34;bb\u0026#34;}); ds_save(0, [[],{\u0026#34;h1\u0026#34;:123, \u0026#34;h2\u0026#34;:\u0026#34;aa\u0026#34;},{\u0026#34;h1\u0026#34;:1234, \u0026#34;h2\u0026#34;:\u0026#34;dd\u0026#34;}]); "},{"id":50,"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/","title":"自定义首页","section":"6.进阶开发 Pro","content":" 应用场景 # 需要用户打开首页时直接查看相应报表 自定义人性化的首页显示 使用方法 # 如果已经有开发好的仪表盘页面, 可以找到它的访问url, 如:/echart/?type=2 设置系统环境变量 SMC_HOME_PAGE=/echart/?type=2 如果你使用django部署, 也可以采用在setting.py中加入配置: SMC_HOME_PAGE=\u0026#39;/echart/?type=2\u0026#39; 这样就可以在首页直接显示设定好的页面了\n"},{"id":51,"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/","title":"第一个3D场景","section":"1.基础操作","content":" 新建仪表盘 # 在开发模式下，滑动“开发管理” -\u0026gt;\u0026ldquo;仪表盘\u0026rdquo;-\u0026gt; \u0026ldquo;新增Dashboard\u0026rdquo; 填写相应信息后点击“保存” 点击进入仪表盘开发, 注意点击 \u0026ldquo;E\u0026rdquo; 字!! 点击\u0026quot;设定\u0026quot; -\u0026gt; \u0026ldquo;高级设定\u0026rdquo; -\u0026gt; \u0026ldquo;开启模板\u0026rdquo; 此时可以在工具栏中看到\u0026quot;模板\u0026quot;, 点击进入模板开发 上传模型文件 # 在模板开发界面中, 点击\u0026quot;工具\u0026quot; -\u0026gt; \u0026ldquo;文件上传\u0026rdquo;, 上传你的模型文件, 支持\u0026quot;obj,stl,gltf\u0026quot;格式 上传后点击下方文件, 将自动复制资源链接 场景开发 # 在模板开发界面,将第一行\u0026quot;base.html\u0026quot;修改为\u0026quot;base3d.html\u0026quot; 鼠标放在如下图script标签内, 点击菜单\u0026quot;3D模型\u0026quot; -\u0026gt; \u0026ldquo;加载模型\u0026rdquo; 将上一步中复制出的模型链接, 替换模型url 点击保存, 即可看到3D场景, 不过可能模型过大或过小, 可以进行调整相机景深 点击菜单\u0026quot;3D模型\u0026quot; -\u0026gt; \u0026ldquo;相机景深\u0026rdquo;, 使模型大小到合适 点击\u0026quot;环境光\u0026quot;和\u0026quot;点光源\u0026quot;设定 点击旋转动画, 模型会自动旋转 更多功能可自行探索, 比如交互点击响应事件, 贴图等 也可购买专业版本解锁高级用法\n"},{"id":52,"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/","title":"ID E开发模式","section":"低代码开发","content":" 应用场景 # 如果您是一个资深的前端开发者 可能不需要使用smartchart组件,仅需使用到数据集 你希望在IDE(如VS code)中开发然后打包发布 非专用人士,请不要尝试这种方式 开发方式 # 在模板中使用basesimple 此时smartchart不会引用任何echarts, vue组件, 完全由您自已控制引入\n如何使用数据集接口 # 在仪表中新增懒加载数据集 修改对应图形编辑器, 使数据赋值给一个全局变量或vue 在IDE中开发 # 由于你在开发中仅需要用到filter_param及ds_refresh, 建意新建一个js文件, 文件内容:\n//以下为辅助方法, 发布时, 无需放入smartchart模板中 var filter_param = {}; function ds_refresh(num){ if(num === 0){你对应的图形中赋值代码,调试代码} if(num === 1){....} ...... } 然后将这个js文件在你的项目中引用调试使用\n如何部署到smartchart # 打包完成后会有相应的css, js 和index.html文件, 将index.html中的代码复制贴粘到对应的模板区域中即可\n上传css,js 修改css,js 相关引用路径 去除之前定义的js辅助开发文件引用, 如果有定义全局变量, 将全局变量定义复制到模板js区域 "},{"id":53,"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/","title":"后台 Api刷新","section":"数据服务","content":" 应用场景 # 有ETL流程，需要等待后台数据刷新完成后，再触发仪表盘的刷新，数据未完成刷新，仪表盘不刷新 针对有一些耗时的查询, 虽然smartchart有缓存加速, 但是在第一次刷新时可能不能达到极速 用户需要随时都能体验到极速的打开效果 使用后台API刷新，建意将仪表盘中数据集的缓存时间设置长一些，比如2天（2880分钟）\n后台数据主动刷新接口 # (购买专业版本后支持)\n你需要在setting.py中设定API_TOKEN API_TOKEN = \u0026#39;xxxxxxxx\u0026#39; 找到你要刷新的仪表盘编码, 你可以在打开的仪表盘url上面找到这个type id\n后台访问如下api url即可\nhttp://ip:端口/echart/refresh_ds/?type=你的报表ID\u0026amp;token=你设定的API_TOKEN 关于定时刷新 # 为保持产品的轻量化及坚持专业的产品做专业的事情, 归一化统一化的架构设计, 我们不会集成相关调度系统, 一般我们推荐使用您自有的调度工具或平台, 如airflow, 我们也有相关的配套产品\n如果您仅仅是简单应用, 也无需使用专用调度来增加运维复杂度, 可以使用linux自带的即可\n新建一个sh文件, 假设目录在/data/smartchart vim refresh_smartchart.sh 写入需要刷新的脚本 echo start refresh $(date \u0026#34;+%Y-%m-%d %H:%M:%S\u0026#34;) curl http://ip:端口/echart/?type=你的报表ID1\u0026amp;token=你设定的API_TOKEN curl http://ip:端口/echart/?type=你的报表ID2\u0026amp;token=你设定的API_TOKEN echo end refresh $(date \u0026#34;+%Y-%m-%d %H:%M:%S\u0026#34;) 如果你的网址是https, 可如下方法使用curl\ncurl -k --insecure \u0026#34;https://www.baidu.com” 修改为可执行文件 chmod 775 refresh_smartchart.sh 使用crontab来定时执行 # 编辑crontab crontab -e # 比如需要每天晚上5点10分执行 10 5 * * * /data/smartchart/refresh_smartchart.sh \u0026gt;\u0026gt;/data/smartchart/log.txt 2\u0026gt;\u0026amp;1 # 定时参数说明 * * * * * - - - - - | | | | | | | | | +----- 星期中星期几 (0 - 6) (星期天 为0) | | | +---------- 月份 (1 - 12) | | +--------------- 一个月中的第几天 (1 - 31) | +-------------------- 小时 (0 - 23) +------------------------- 分钟 (0 - 59) "},{"id":54,"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/","title":"第一个上线数据集","section":"1.基础操作","content":"实在想不出用什么名称来描述这个功能, 将就这个吧\n应用场景 # 数据集和图形复用, 开发完成后可以直接在仪表盘中拖拽 制做指标体系供用户使用,实现0代码功能 非常适合于OEM场景 新建数据集 # 在开发菜单 \u0026ndash;\u0026gt; 数据集 \u0026ndash;\u0026gt; 新增 \u0026ndash;\u0026gt; 保存 在数据集列表中 \u0026ndash;\u0026gt; 点图标E \u0026ndash;\u0026gt; 进入数据集编辑器 开发完成数据后, 点击数据集编辑器, 保存数据集后点击进入图形开发,如下图 调整图形保存即可, 此方法新增的数据集默认为上线状态 按相同的方法, 新增几个数据集 在仪表盘中使用上线数据集 # 进入仪表盘开发界面 点击\u0026quot;新增\u0026quot; \u0026ndash;\u0026gt; \u0026ldquo;上线数据集\u0026rdquo;, 点击相应的数据集 即可在仪表盘中显示出此\u0026quot;上线数据集\u0026quot; 仪表盘中的上线数据集开发 # 上线数据集在仪表盘中不可以修改, 如需修改数据集, 按如下图复制出来后即可修改 "},{"id":55,"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/","title":"Web Socket方式","section":"特殊数据源","content":" 应用场景 # 对于实时程度要求比较高的情况下, 如果你后端已有实现websocket的接口, smartchart也可以很方便的接入 参考以下步骤即可\n在\u0026quot;模板\u0026quot;中定义一个全局变量, 如ws_data 编写连接和接收代码段逻辑 在接收代码段加入ds_refresh, 如要刷新0号图形, 则加入ds_refresh(0) 在\u0026quot;高级\u0026quot;设定中加入共享数据集设定, 把ws_data映射到0号图形即可 代码段参考 # let ws_data = [[\u0026#39;初始化\u0026#39;,\u0026#39;V\u0026#39;],[\u0026#39;A\u0026#39;,\u0026#39;2\u0026#39;]]; let ws = null; if(\u0026#39;webSocket\u0026#39; in window){ print(\u0026#39;支持webSocket\u0026#39;); ws = new webSocket(\u0026#39;ws://127.0.0.1:2222/abc\u0026#39;); //连接成功 ws.onopen = function(){ print(\u0026#39;ws连接成功\u0026#39;); } //接收消息 ws.onmessage = function(evt){ ws_data = evt.data; ds_refresh(0); } } else{ print(\u0026#39;浏览器不支持ws\u0026#39;) } "},{"id":56,"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/","title":"动画效果","section":"低代码开发","content":" 自动旋转效果 # 在\u0026quot;模板\u0026quot;的style中加入以下样式\n@-webkit-keyframes spin { from {-webkit-transform: rotate(0deg);} to {-webkit-transform: rotate(360deg);} } @keyframes spin { from {transform: rotate(0deg);} to {transform: rotate(360deg);} } .Rotate { -webkit-animation: spin 3s linear 3s 5 alternate; animation: spin 3s linear infinite; } 如需任意组件自动旋转, 只需将Rotate这个类给到这个组件即可, 比如图形\n\u0026lt;img class=\u0026#34;Rotate\u0026#34; src=\u0026#34;https://www.smartchart.cn/media/editor/smc162_20220407150432307320.png\u0026#34;\u0026gt; 组件变形 # 常见变形沿着Y轴, 其它变形方式自已搜索, 比如需要0号,1号图形变形的样式写法\n#container_0{transform:skewY(10deg);} #container_1{transform:skewY(-10deg);} 效果如下: "},{"id":57,"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/","title":"创建连接池","section":"1.基础操作","content":" 如何新增数据源 # 在开发模式下，点击“开发管理”-\u0026gt;数据源-\u0026gt;新增 配置连接池参数，注意数据库填写是备注中有写的名称 你可以通过新建一个数据集来测试连接池的连通性\n点击“保存” 后，回到数据集列表 点击如下图标\u0026quot;E\u0026quot;，进入数据集开发界面 在开发界面调试 安全控制 # 你可以在“参数”中设定安全控制，可避免用户误操作导致前后端卡死 limit: 可限定最大返回数据数量(但实际数据库查询无limit,需通过mode控制) mode: 控制用户查询行为，默认为模式1\n模式 说明 0 严格模式，每次查询向数据库都会增加limit，MPP类型数据库可能会排序失效 1 开发模式，仅调试查询数据库都会增加limit，调试时MPP类型数据库可能会排序失效，但不影响实际 2 宽松模式，查询都不带limit, 仅控制返回limit,需开发者避免大查询 支持的数据源： # 数据库 驱动填写 需安装 使用说明 Mysql mysql 默认支持 Mysql连接池 mysqlpool Sqlite sqlite 默认支持 连接地址填写绝对路径 API 任意 默认支持 参考数据集说明文档 EXCEL 任意 默认支持 参考数据集说明文档 SQL Server mssql 需安装 pip install pymssql SQL Server连接池 mssqlpool ORACLE oracle pip install cx_Oracle ORACLE连接池 oraclepool PostgreSql gp pip install psycopg2 GP gp pip install psycopg2 Impala impala pip install impyla Hive hive pip install impyla DB2 db2 pip install ibm_db 达梦 dm pip install dmPython Python python pip install pandas, openpyxl 参考数据集-\u0026gt;特殊数据源 Redis redis pip install redis 参考数据集-\u0026gt;特殊数据源 Mongodb mongodb pip install pymongo 参考数据集-\u0026gt;特殊数据源 Clickhouse clickhouse pip install clickhouse_driver Elasticsearch es pip install elasticsearch==7.13.0 参考数据集-\u0026gt;特殊数据源 Prometheus prometheus 参考数据集-\u0026gt;特殊数据源 influxdb influxdb pip install influxdb Sqlalchemy sqlalchemy pip install sqlalchemy 参考数据集-\u0026gt;特殊数据源 JDBC jdbc pip install JayDeBeApi 参考数据集-\u0026gt;特殊数据源 自定义 自定义 用户自由定义 参考数据集-\u0026gt;特殊数据源 "},{"id":58,"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/","title":"编辑器快捷键","section":"低代码开发","content":" 功能 WIN MAC 说明 显示菜单 CTRL-, Command-, 折叠其它 Alt-0 Command-Option-0 查找替换 Ctrl-F Command-F 重复选中 Ctrl-D Command-D 注释选中 Ctrl-/ Command-/ 取消修改 Ctrl-z Command-z 重新执行 Ctrl-y Command-y 数据集编辑 Ctrl-Q Ctrl-Q 选中大写 Ctrl-U Ctrl-U 选中小写 SHIFT-Ctrl-U SHIFT-Ctrl-U "},{"id":59,"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/","title":"应用模板","section":"1.基础操作","content":" 应用场景 # 你可以快速应用开发好的模板,极大的提高你的开发和学习效率\n应用本地模板 # 你可以快速应用本地备份的模板, 我们内置了一个 通用的数据查询和下载模板 , 你可以尝试\n新建一个全新的dashboard, 不要放任何报表, 点击保存且编辑后, 下方可以看到下载链接, 然后点击下载即可直接应用 输入\u0026quot;01_SMARTCHART\u0026quot;, 点击本地恢复即可 更多本地备份恢复参考\n应用商店模板 # 方法同上\u0026quot;应用本地模板\u0026quot;, 注意应用商店模板为收费增值服务\n你可以点击 模板查询, 查看相应的价格后在 TB购买即可获取下载密钥 如果是全新的仪表盘, 直接输入下载密钥, 点击\u0026quot; 商城下载 \u0026ldquo;即可 如果仪表盘中有数据集且不再需要, 可以在下载密钥前面加上FORCE即可自动清空已有数据集后自动下载 注意模板太廉价,购买后并没有咨询服务,请务必自行了解如何使用\n资源文件放置路径 有些资源会离线打包提供给你, 只需上传即可, 上传方法参考\n如果不清楚可以观看视屏说明 使用方法可参考视屏: 一键应用模板\n"},{"id":60,"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/","title":"权限管理","section":"1.基础操作","content":"目前的权限管理,大概如下:\n开发者权限 # 点击进入后台的图标, 在后台中你可以控制用户的开发权限 新建用户默认是没有开发权限的, 在首页也看不到任何开发相关的菜单\n如果你需要给用户开发权限, 需要设定如下: Dashboard报表查看权限 # 你可以在 仪表盘设定 中进行权限管理 在dashboard设定页面中可针对人员来分配 编辑权限, 有编辑权限同时也会满足查看权限 在dashboard设定页面中可针对组来分配 查看权限 未上线 的报表, 只会在编辑页面中出现, 可以预览 公开 的报表, 如没有分配编辑权限,在编辑页面中不出现, 但在查看页面所有人可见，你可以共享给所有人，访问url: http://xxxxx：8000/echart?type=你的仪表盘名称 手机端过滤, 你可以通过 \u0026ldquo;全端\u0026rdquo;,\u0026ldquo;电脑端\u0026rdquo; 选项实现, 当勾选 \u0026ldquo;全端\u0026rdquo; 时, 手机端电脑端都会显示, 当未勾选 全端, 也不勾选 电脑端时, 只会在 手机显示, 反之只在电脑端显示 "},{"id":61,"href":"/docs/10.%E5%85%B6%E5%AE%83/FAQ/","title":"Faq","section":"10.其它","content":" FAQ # 启动显示 以一种访问权限不允许的方式做了一个访问套接字的尝试 出现这种情况在Windows中很常见，就是端口被占用，酷狗音乐会占用8000端口 使用netstat -ano|findstr 8000 找到进程号 使用taskkill /pid 进程号 /F\n输入命令找不到smartchart 检查你是否有安装多个python环境出现环境变量冲突,请卸载一个或取消一个环境变量\n如法安装pip 请确认在安装python时,有没有加入环境变量, 可自行加入, 或卸载重装\n关于mac版本安装后的各种问题 目前来看最大的可能是，/Library/Developer/CommandLineTools这个目录下有python3，应该是在某一个版本的Xcode command line tools安装时生成的 可以先把python3全部卸载，再重新按说明安装，命令行中输入python3 和 pip3， 找不到command时才说明完全卸载成功\nsudo rm -rf /Library/Developer/CommandLineTools sudo rm -f /usr/bin/python3 如果密码忘记了怎么办 命令行输入smartchart changepassword 你的用户名\n"},{"id":62,"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/","title":"试用激活说明","section":"10.其它","content":"试用专业版激活码需要每3天激活一次,激活方式：\n由于开发很忙, 文档可能会写得有不尽之处, 多多包涵\n"},{"id":63,"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/","title":"Sqlite3版本错误","section":"Linux","content":"SQLite3版本错误 在部分操作系统下（比如CentOS 7）使用SQLite3数据库运行会出现如下的错误提示：\ndjango.core.exceptions.ImproperlyConfigured: SQLite 3.8.3 or later is required (found 3.7.17). 这表明操作系统自带的sqlite3版本过低，需要将系统的sqlite3进行升级。\n以下是一种方法，来自于 StackOverlow：\n1、下载新版本的SQLite3\nwget https://www.sqlite.org/2019/sqlite-autoconf-3290000.tar.gz 2、解压文件\ntar zxvf sqlite-autoconf-3290000.tar.gz 3、进行解压后的目录\ncd sqlite-autoconf-3290000 4、配置安装目录\n./configure --prefix=$HOME/opt/sqlite 5、编译安装\nmake \u0026amp;\u0026amp; make install 6、指定环境变量\nexport PATH=$HOME/opt/sqlite/bin:$PATH export LD_LIBRARY_PATH=$HOME/opt/sqlite/lib export LD_RUN_PATH=$HOME/opt/sqlite/lib 完成之后可以运行sqlite3 \u0026ndash;version 命令来查看当前的SQLite3版本。\n如果还是不行, 报错如下: 可如下方式处理\n# 安装 pip3 install pysqlite3 pip3 install pysqlite3-binary # 编辑django的文件, 路径参考报错 vi xxxxxx/lib/python3.9/site-packages/django/db/backends/sqlite3/base.py # 修改内容 # from sqlite3 import dbapi2 as Database # 注释掉这里 from pysqlite3 import dbapi2 as Database # 然后保存退出就可以了 :wq! "},{"id":64,"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/","title":"生产部署","section":"Linux","content":"购买专业版本，提供企业生产部署及无网离线部署方案\n"},{"id":65,"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/","title":"Elasticsearch数据源","section":"特殊数据源","content":" 数据源配置方法 # 查询方法 # 更多查询方法参考 # 模糊查询 body = { \u0026#39;query\u0026#39;: { # 查询命令 \u0026#39;match\u0026#39;: { # 查询方法：模糊查询（会被分词）。比如此代码，会查到只包含：“我爱你”， “中国”的内容 \u0026#39;name\u0026#39;: \u0026#39;刘\u0026#39; } }, \u0026#39;size\u0026#39;: 20 # 不指定默认是10，最大值不超过10000（可以修改，但是同时会增加数据库压力） } term，精准单值查询 # 注：此方法只能查询一个字段，且只能指定一个值。类似于mysql中的where ziduan=\u0026#39;a\u0026#39; body ={ \u0026#39;query\u0026#39;:{ \u0026#39;term\u0026#39;:{ \u0026#39;ziduan1.keyword\u0026#39;: \u0026#39;刘婵\u0026#39; # 查询内容等于“我爱你中国的”的数据。查询中文，在字段后面需要加上.keyword # \u0026#39;ziduan2\u0026#39;: \u0026#39;liuchan\u0026#39; } } } erms，精准多值查询 #此方法只能查询一个字段，但可以同时指定多个值。类似于mysql中的where ziduan in (a, b,c...) body ={ \u0026#34;query\u0026#34;:{ \u0026#34;terms\u0026#34;:{ \u0026#34;ziduan1.keyword\u0026#34;: [\u0026#34;刘婵\u0026#34;, \u0026#34;赵云\u0026#34;] # 查询ziduan1=\u0026#34;刘婵\u0026#34;或=赵云...的数据 } } } multi_match，多字段查询 # 查询多个字段中都包含指定内容的数据 body = { \u0026#34;query\u0026#34;:{ \u0026#34;multi_match\u0026#34;:{ \u0026#34;query\u0026#34;:\u0026#34;我爱你中国\u0026#34;, # 指定查询内容，注意：会被分词 \u0026#34;fields\u0026#34;:[\u0026#34;ziduan1\u0026#34;, \u0026#34;ziduan2\u0026#34;] # 指定字段 } } } prefix，前缀查询 body = { \u0026#39;query\u0026#39;: { \u0026#39;prefix\u0026#39;: { \u0026#39;ziduan.keyword\u0026#39;: \u0026#39;我爱你\u0026#39; # 查询前缀是指定字符串的数据 } } } # 注：英文不需要加keyword wildcard，通配符查询 body = { \u0026#39;query\u0026#39;: { \u0026#39;wildcard\u0026#39;: { \u0026#39;ziduan1.keyword\u0026#39;: \u0026#39;?刘婵*\u0026#39; # ?代表一个字符，*代表0个或多个字符 } } } # 注：此方法只能查询单一格式的（都是英文字符串，或者都是汉语字符串）。两者混合不能查询出来。 regexp，正则匹配 body = { \u0026#39;query\u0026#39;: { \u0026#39;regexp\u0026#39;: { \u0026#39;ziduan1\u0026#39;: \u0026#39;W[0-9].+\u0026#39; # 使用正则表达式查询 } } } bool，多条件查询 # must：[] 各条件之间是and的关系 body = { \u0026#34;query\u0026#34;:{ \u0026#34;bool\u0026#34;:{ \u0026#39;must\u0026#39;: [{\u0026#34;term\u0026#34;:{\u0026#39;ziduan1.keyword\u0026#39;: \u0026#39;我爱你中国\u0026#39;}}, {\u0026#39;terms\u0026#39;: {\u0026#39;ziduan2\u0026#39;: [\u0026#39;I love\u0026#39;, \u0026#39;China\u0026#39;]}}] } } } # should: [] 各条件之间是or的关系 body = { \u0026#34;query\u0026#34;:{ \u0026#34;bool\u0026#34;:{ \u0026#39;should\u0026#39;: [{\u0026#34;term\u0026#34;:{\u0026#39;ziduan1.keyword\u0026#39;: \u0026#39;我爱你中国\u0026#39;}}, {\u0026#39;terms\u0026#39;: {\u0026#39;ziduan2\u0026#39;: [\u0026#39;I love\u0026#39;, \u0026#39;China\u0026#39;]}}] } } } # must_not：[]各条件都不满足 body = { \u0026#34;query\u0026#34;:{ \u0026#34;bool\u0026#34;:{ \u0026#39;must_not\u0026#39;: [{\u0026#34;term\u0026#34;:{\u0026#39;ziduan1.keyword\u0026#39;: \u0026#39;我爱你中国\u0026#39;}}, {\u0026#39;terms\u0026#39;: {\u0026#39;ziduan2\u0026#39;: [\u0026#39;I love\u0026#39;, \u0026#39;China\u0026#39;]}}] } } } # bool嵌套bool # ziduan1、ziduan2条件必须满足的前提下，ziduan3、ziduan4满足一个即可 body = { \u0026#34;query\u0026#34;:{ \u0026#34;bool\u0026#34;:{ \u0026#34;must\u0026#34;:[{\u0026#34;term\u0026#34;:{\u0026#34;ziduan1\u0026#34;:\u0026#34;China\u0026#34;}}, # 多个条件并列 ，注意：must后面是[{}, {}],[]里面的每个条件外面有个{} {\u0026#34;term\u0026#34;:{\u0026#34;ziduan2.keyword\u0026#34;: \u0026#39;我爱你中国\u0026#39;}}, {\u0026#39;bool\u0026#39;: { \u0026#39;should\u0026#39;: [ {\u0026#39;term\u0026#39;: {\u0026#39;ziduan3\u0026#39;: \u0026#39;Love\u0026#39;}}, {\u0026#39;term\u0026#39;: {\u0026#39;ziduan4\u0026#39;: \u0026#39;Like\u0026#39;}} ] }} ] } } } "},{"id":66,"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/","title":"Jdbc数据源","section":"特殊数据源","content":" 应用场景 # 当无法在python中找到连接库时, 你还可以采用jdbc的连接方式\n使用方法 # 首先您需要安装jdbc的包 pip install JayDeBeApi 在任意的一个仪表盘的 \u0026ldquo;模板\u0026rdquo; 编辑器中, 点击上传资源的图标上传相应的jdbc JAR包即可 新建连接的方式, 以下使用impala为例 "},{"id":67,"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/","title":"Kafka数据源","section":"特殊数据源","content":"用于获取kafka指定分区的最后一条记录, 用于实时场景 使用方法参考\u0026quot;自定义数据源\u0026quot; 以下为参考代码:\ndef dataset(*args, **kwargs): \u0026#34;\u0026#34;\u0026#34; 返回查询数据集 :return: 二维数组或JSON字典 \u0026#34;\u0026#34;\u0026#34; from kafka import KafkaConsumer, TopicPartition import json sqlList = args[0] # 数据集编辑界面的输入已按分号拆分成数组 [sql1, sql2...] config = args[1] # 相关的配置字典{\u0026#39;host\u0026#39;,\u0026#39;port\u0026#39;,\u0026#39;user\u0026#39;,\u0026#39;password\u0026#39;,\u0026#39;db\u0026#39;} # 插入你的数据查询及处理代码, 生成result即可 result = {} consumer = KafkaConsumer(sasl_mechanism=\u0026#39;PLAIN\u0026#39;, security_protocol=\u0026#39;SASL_PLAINTEXT\u0026#39;, sasl_plain_username=config[\u0026#39;user\u0026#39;], sasl_plain_password=config[\u0026#39;password\u0026#39;], bootstrap_servers=config[\u0026#39;host\u0026#39;], auto_offset_reset=\u0026#39;earliest\u0026#39;, api_version=(1, 0, 0), consumer_timeout_ms=50, value_deserializer=lambda v: json.loads(v.decode(\u0026#39;utf-8\u0026#39;)), ) topic = sqlList[0] partition = int(config[\u0026#39;db\u0026#39;]) tp = TopicPartition(topic=topic, partition=partition) consumer.assign([tp]) end_offsets = consumer.end_offsets([tp]).get(tp) # 获取当前消费者最大偏移量 consumer.seek(tp, offset=end_offsets-1) for message in consumer: result = message.value break return result def insert_dataset(*args, **kwargs): \u0026#34;\u0026#34;\u0026#34; 数据填报实现 \u0026#34;\u0026#34;\u0026#34; from kafka import KafkaProducer import json contents = args[0] # 传入的数据集二维数组格式 table = args[1] # 配置中的表名 config = args[3] # 相关的配置字典{\u0026#39;host\u0026#39;,\u0026#39;port\u0026#39;,\u0026#39;user\u0026#39;,\u0026#39;password\u0026#39;,\u0026#39;db\u0026#39;} # 插入你的写入数据逻辑代码 producer = KafkaProducer(sasl_mechanism=\u0026#39;PLAIN\u0026#39;, security_protocol=\u0026#39;SASL_PLAINTEXT\u0026#39;, sasl_plain_username=config[\u0026#39;user\u0026#39;], sasl_plain_password=config[\u0026#39;password\u0026#39;], bootstrap_servers=config[\u0026#39;host\u0026#39;], value_serializer=lambda v: json.dumps(v).encode(\u0026#39;utf-8\u0026#39;) ) producer.send(table, value=contents, partition=int(config[\u0026#39;db\u0026#39;])) "},{"id":68,"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/","title":"Mongodb数据源","section":"特殊数据源","content":" 使用方法 # 连接池正常配置即可 数据集开发中，填写查询需求： {\u0026#34;db\u0026#34;: \u0026#34;db1\u0026#34;, \u0026#34;table\u0026#34;: \u0026#34;tb1\u0026#34;, \u0026#34;filter\u0026#34;: {\u0026#34;name\u0026#34;: \u0026#34;Zarten\u0026#34;}, \u0026#34;projection\u0026#34;: {\u0026#34;_id\u0026#34;: 0}, \u0026#34;sort\u0026#34;: [[\u0026#34;_id\u0026#34;, 1]], \u0026#34;limit\u0026#34;: 10} 由于返回的字典格式， 如需转化成二维数组， 可使图形中的转化函数ds_mapToList\nlet dataset=ds_mapToList(__dataset__); 参数说明： # 除table，其它都为可选参数\n参数 说明 样列 db 数库名,默认连接设定中db名 table 表名[必填] filter 筛选项,具体用法参考下文 {\u0026ldquo;name\u0026rdquo;: \u0026ldquo;Zarten\u0026rdquo;,\u0026ldquo;date\u0026rdquo;:\u0026ldquo;2020-10-01\u0026rdquo;} projection 显示列 {\u0026ldquo;name\u0026rdquo;: 1,\u0026ldquo;date\u0026rdquo;:1} sort 排序，-1为降序 [[\u0026ldquo;date\u0026rdquo;, -1]] limit 限定返回数量 filter条件说明 # 且条件\n{\u0026#34;age\u0026#34;:{\u0026#34;$gt\u0026#34;:22}, \u0026#34;name\u0026#34;:{\u0026#34;$regex\u0026#34;:\u0026#34;user\u0026#34;}} 或条件\n{ \u0026#34;$or\u0026#34;: [ {\u0026#34;age\u0026#34;: {\u0026#34;$gt\u0026#34;: 22}}, {\u0026#34;name\u0026#34;: {\u0026#34;$regex\u0026#34;: \u0026#34;user\u0026#34;}} ] } 比较查询 $lt和\u0026lt;，$lte和\u0026lt;=，$gt和\u0026gt;，gte和\u0026gt;=，ne和!=是一一对应的\n{\u0026#34;field_name\u0026#34;: {\u0026#34;$lt\u0026#34;: value, \u0026#34;$gt\u0026#34;: value}} 关联查询$in和$nin\n{\u0026#34;field_name\u0026#34;: {\u0026#34;$in\u0026#34;: [1,5,8]}} $regex为模糊查询的字符串提供正则表达式功能\n{\u0026#34;$or\u0026#34;: [{\u0026#34;field_name\u0026#34;: {\u0026#39;$regex\u0026#39;: value}},{\u0026#34;field_name2\u0026#34;: {\u0026#34;$regex\u0026#34;: value}}]} "},{"id":69,"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/","title":"Promitheus数据源","section":"特殊数据源","content":" 数据源配置方法 # 驱动: prometheus 连接地址: http://ip:9090\n查询方法 # 输入常规查询命令即可 返回值为prometheus标准json, 你需要在图形编辑器中使用js处理数据\nlet dataset=__dataset__; //获取返回值列表中的第一值 dataset = dataset.data.result[0].value; print(dataset) 处理数据样列 # 如获得的数据\n{ \u0026#34;status\u0026#34;:\u0026#34;success\u0026#34;, \u0026#34;data\u0026#34;:{ \u0026#34;resultType\u0026#34;:\u0026#34;vector\u0026#34;, \u0026#34;result\u0026#34;:[ {\u0026#34;metric\u0026#34;:{\u0026#34;__name__\u0026#34;:\u0026#34;starrocks_fe_routine_load_jobs\u0026#34;,\u0026#34;group\u0026#34;:\u0026#34;fe\u0026#34;,\u0026#34;instance\u0026#34;:\u0026#34;xxx:8030\u0026#34;,\u0026#34;job\u0026#34;:\u0026#34;StarRocks_Cluster01\u0026#34;,\u0026#34;state\u0026#34;:\u0026#34;CANCELLED\u0026#34;}, \u0026#34;value\u0026#34;:[1671188429.573,\u0026#34;0\u0026#34;] }, {\u0026#34;metric\u0026#34;:{\u0026#34;__name__\u0026#34;:\u0026#34;starrocks_fe_routine_load_jobs\u0026#34;,\u0026#34;group\u0026#34;:\u0026#34;fe\u0026#34;,\u0026#34;instance\u0026#34;:\u0026#34;xxx:8030\u0026#34;,\u0026#34;job\u0026#34;:\u0026#34;StarRocks_Cluster01\u0026#34;,\u0026#34;state\u0026#34;:\u0026#34;NEED_SCHEDULE\u0026#34;}, \u0026#34;value\u0026#34;:[1671188429.573,\u0026#34;2\u0026#34;]} ... ] } } 图形中处理成smartchart标准格式\n//处理prometheus let df = __dataset__; let result = df.data.result; let dataset = [[\u0026#39;instance\u0026#39;,\u0026#39;state\u0026#39;,\u0026#39;qty\u0026#39;]]; //二维表头 for(let item of result){ let pmetric = item.metric; let pvalue = item.value; dataset.push([pmetric.instance,pmetric.state,pvalue[1]]); } dataset = ds_pivot(dataset); //列转行 如果带时序的, 数据处理参考\nlet df = __dataset__; let result = df.data.result; let dataset = [[\u0026#39;instance\u0026#39;,\u0026#39;seq\u0026#39;,\u0026#39;qty\u0026#39;]]; //二维表头 for(let item of result){ let pmetric = item.metric; let pvalues = item.values; let startv = pvalues[0][1]; //初始值 for(let i=1; i\u0026lt;pvalues.length; i++){ let pvalue = pvalues[i]; dataset.push([i,pmetric.instance,pvalue[1]-startv]); //计算增长值 } } dataset = ds_pivot(dataset); //列转行 你可能会用上的时间戳转文本格式\nfunction getLocalTime(nS) { return new Date(nS * 1000).toLocaleString(); } 支持多段查询 # 使用分号(;)分隔查询 "},{"id":70,"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/","title":"Redis数据源","section":"特殊数据源","content":" 应用场景 # 你可能会有这样的一些需求, 展示数据是要通过外部的程序计算好,如一些实时的计算场景,用spark计算好的数据 或爬虫爬取的数据, 然后写入redis或nosql的数据库,最后由前端图形直接展示或数据下载,SmartChart支持这一块的应用\n使用方法 # 你可以创建一个redis的连接池, 然后按照通用的方法建立数据集 不同的是, 数据集的SQL区不再是写sql代码, 而只需要写redis中的keyname\n如redis中存储的数据是keyname 为 \u0026ldquo;指标A\u0026rdquo;, 数据 \u0026lsquo;{\u0026ldquo;长沙\u0026rdquo;:1,\u0026ldquo;上海\u0026rdquo;:2}\u0026rsquo; 这样我们只需要在数据集中写上\n指标A 即可, 最后你会得到{\u0026ldquo;长沙\u0026rdquo;:1,\u0026ldquo;上海\u0026rdquo;:2}的返回结果\n如果你需要的是表格格式, 那么你只需要往redis中存入一个二维数组, 比如: [[\u0026ldquo;省份\u0026rdquo;,\u0026ldquo;数量\u0026rdquo;],[\u0026ldquo;长沙\u0026rdquo;,1],[\u0026ldquo;上海\u0026rdquo;,2]]\n注意数据存入redis为字符串格式,你可使用python的json.dumps来生成字符串格式存入\n当然我们也支持同一个数据中获取多个keyname # 比如还有一个\u0026quot;指标B\u0026quot;, 数据是'12345' 我们可以同时写上两个指标,用分号隔开:\n指标A;指标B 最后你会得到的结果是: { \u0026ldquo;指标A\u0026rdquo;:{\u0026ldquo;长沙\u0026rdquo;:1,\u0026ldquo;上海\u0026rdquo;:2}, \u0026ldquo;指标B\u0026rdquo;:12345 }\n"},{"id":71,"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/","title":"Sqlalchemy连接","section":"特殊数据源","content":"常规的连接池的设定, 大家应该都很清楚了, Smartchart也支持sqlalchemy连接, 对于一些smartchart不支持的数据源可以使用此方法 配置方法: 只用填以上内容, 其它可留空 连接地址的写法参考sqlalchemy说明:\n可选参数。一个标准的链接URL是这样的： dialect+driver://username:password@host:port/database dialect，是数据库类型，大概包括：sqlite, mysql, postgresql, oracle, or mssql. driver，是使用的数据库API，驱动，连接包，随便叫什么吧。 username，用户名 password，密码 host，网络地址，可以用ip，域名，计算机名，当然是你能访问到的。 port，数据库端口。 databas，数据库名。 其实这些也就dialect和dirver需要解释。 二：连接sqlite3 1，驱动 sqlite3是个文件数据库，不需要什么驱动，或者说python内置了驱动。 2，标准连接参数 # sqlite://\u0026lt;nohostname\u0026gt;/\u0026lt;path\u0026gt; 没有hostname 3，各种链接参数 # 相对路径，就是这个python文件同目录下foo.db engine = create_engine(\u0026#39;sqlite:///foo.db\u0026#39;) #绝对路径 #Unix/Mac下用四条////表示 engine = create_engine(\u0026#39;sqlite:////absolute/path/to/foo.db\u0026#39;) #Windows下用三条///加盘符路径用两条\\\\ engine = create_engine(\u0026#39;sqlite:///C:\\\\path\\\\to\\\\foo.db\u0026#39;) #Windows 也可以这么用三条///加盘符路径用一条\\ engine = create_engine(r\u0026#39;sqlite:///C:\\path\\to\\foo.db\u0026#39;) #数据库建在内存里。URI保持为空即可 engine = create_engine(\u0026#39;sqlite://\u0026#39;) 三：连接mysql（mariadb） sqlalchemy默认使用mysql-python作为链接驱动，既default模式 选哪种驱动，就装哪个包。 1，default默认链接方式 engine = create_engine(\u0026#39;mysql://scott:tiger@localhost/foo\u0026#39;) 2，# mysql-python，声明使用mysql-python驱动 engine = create_engine(\u0026#39;mysql+mysqldb://scott:tiger@localhost/foo\u0026#39;) 3，MySQL-connector-python 声明使用MySQL-connector-python驱动（推荐使用） engine = create_engine(\u0026#39;mysql+mysqlconnector://scott:tiger@localhost/foo\u0026#39;) 4，OurSQL 声明使用OurSQL驱动 engine = create_engine(\u0026#39;mysql+oursql://scott:tiger@localhost/foo\u0026#39;) 四：连接Microsoft SQL Server sqlalchemy默认使用 pyodbc作为链接驱动。 1，pyodbc engine = create_engine(\u0026#39;mssql+pyodbc://scott:tiger@mydsn\u0026#39;) 2，pymssql engine = create_engine(\u0026#39;mssql+pymssql://scott:tiger@hostname:port/dbname\u0026#39;) 五：连接PostgreSQL PostgreSQL默认使用 psycopg2作为链接驱动，既default模式 1， default engine = create_engine(\u0026#39;postgresql://scott:tiger@localhost/mydatabase\u0026#39;) 2，psycopg2 engine = create_engine(\u0026#39;postgresql+psycopg2://scott:tiger@localhost/mydatabase\u0026#39;) 3， pg8000 engine = create_engine(\u0026#39;postgresql+pg8000://scott:tiger@localhost/mydatabase\u0026#39;) 六：连接Oracle Oracle可能只有 cx_oracle一个驱动包，既default模式和声明模式一样。 1，default engine = create_engine(\u0026#39;oracle://scott:tiger@127.0.0.1:1521/sidname\u0026#39;) 2，cx_oracle engine = create_engine(\u0026#39;oracle+cx_oracle://scott:tiger@tnsname\u0026#39;) "},{"id":72,"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/","title":"带分页的表格","section":"Element Ui组件","content":" 模式开启 # 需要开启模板开发模式, 并开启basevue模板 在Body加入组件 # \u0026lt;!--表格--\u0026gt; \u0026lt;div class=\u0026#34;smtdrag\u0026#34; id=\u0026#34;id_1654907858638\u0026#34;\u0026gt; \u0026lt;el-table :data=\u0026#34;tableData.slice((currentPage-1)*pageSize, currentPage*pageSize)\u0026#34; height=\u0026#34;100%\u0026#34; size=\u0026#34;mini\u0026#34; header-cell-class-name=\u0026#34;tablehead\u0026#34; border style=\u0026#34;width: 100%\u0026#34;\u0026gt; \u0026lt;el-table-column v-for=\u0026#34;item in tableHead\u0026#34; :label=\u0026#34;item.label\u0026#34; :property=\u0026#34;item.prop\u0026#34; sortable\u0026gt; \u0026lt;/el-table-column\u0026gt; \u0026lt;/el-table\u0026gt; \u0026lt;!--表格结束--\u0026gt; \u0026lt;!--分页控件--\u0026gt; \u0026lt;el-pagination align=\u0026#39;center\u0026#39; @size-change=\u0026#34;handlerSizeChange\u0026#34; @current-change=\u0026#34;handlerCurrentChange\u0026#34; :current-page=\u0026#34;currentPage\u0026#34; :page-size=\u0026#34;pageSize\u0026#34; layout=\u0026#34;total,sizes,prev,pager,next,jumper\u0026#34; :total=\u0026#34;tableData.length\u0026#34; \u0026gt;\u0026lt;/el-pagination\u0026gt; \u0026lt;!--分页控件结束--\u0026gt; \u0026lt;/div\u0026gt; 在JS区域加入 # var vapp = new Vue({el: \u0026#39;#vue_app\u0026#39;, delimiters: [\u0026#39;{[\u0026#39;, \u0026#39;]}\u0026#39;], data: { tableData:[], //表数据 tableHead:[], //表头 currentPage:1, total:20, pageSize:10 }, methods: { //处理分页数量 handlerSizeChange(val){ this.currentPage = 1; this.pageSize=val; }, //处理页选择 handlerCurrentChange(val){ this.currentPage = val; } } }); 新增一个数据集(拖拽图形) # 在数据集编辑器中写入查询\nselect * from smartdemo2 limit /* $limit -- */ 100 图形开发中修改 # let df0 = __dataset__; //处理表头 let columnsDict = {\u0026#39;c1\u0026#39;:\u0026#39;渠道\u0026#39;,\u0026#39;qty\u0026#39;:\u0026#39;数量\u0026#39;}; let tableHead = []; let tableHeadLabel; for (let i=0;i\u0026lt;df0[0].length;i++){ if(columnsDict.hasOwnProperty(df0[0][i])){ df0[0][i] = columnsDict[df0[0][i]] } tableHeadLabel=df0[0][i]; tableHead.push({label: tableHeadLabel, prop:df0[0][i]}); } //VUE赋值 vapp.tableHead = tableHead; vapp.tableData=ds_createMap_all(df0); smartchart内置了这个查询模板, 你可以通过 本地模板恢复快速应用\n"},{"id":73,"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/","title":"Line Up图形","section":"特殊图形","content":"Smartchart内置了LineUp图形 LineUp is an interactive technique designed to create, visualize and explore rankings of items based on a set of heterogeneous attributes. LineUp图形参考\nds_loadcss(\u0026#39;smt_LineUp\u0026#39;); ds_loadjs(\u0026#39;smt_LineUp\u0026#39;); let dataset = __dataset__; dataset = ds_createMap_all(dataset); try{Ljs__name__.destroy()}catch{} Ljs__name__ = LineUpJS.asTaggle(dom__name__, dataset); // 点击选中行响应动作 Ljs__name__.on(LineUpJS.LineUp.EVENT_SELECTION_CHANGED, (selection) =\u0026gt; { console.log(Ljs__name__.data._data[selection]); //通过以上log可以查看到数据格式， 以下就是标准的联动写法 filter_param[\u0026#39;LineupParam\u0026#39;] = Ljs__name__.data._data[selection].xx ds_refresh(2); }); //更多响应动作 Ljs__name__.on(LineUpJS.LineUp.EVENT_HIGHLIGHT_CHANGED, (highlight) =\u0026gt; { }); // document.querySelector(\u0026#39;button#select\u0026#39;).addEventListener(\u0026#39;click\u0026#39;, () =\u0026gt; { // Ljs__name__.setSelection([1, 2, 3]); // }); // document.querySelector(\u0026#39;button#highlight\u0026#39;).addEventListener(\u0026#39;click\u0026#39;, () =\u0026gt; { // Ljs__name__.setHighlight(50); // }); // 获取筛选后的数据并下载(来源于\u0026#34;路阳\u0026#34; 赞助开发) outputStr=Ljs__name__.data.exportTable(Ljs__name__.data.getRankings()[0], {}); outputStr = outputStr.replace(/\\t/g, \u0026#39;,\u0026#39;); ds_download(\u0026#39;abc.csv\u0026#39;, outputStr); "},{"id":74,"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/","title":"使用图标","section":"特殊图形","content":"在\u0026quot;模板\u0026quot;中加载图标资源 使用方法, 可参考 font-awesome菜鸟教程 V5图标名称参考, 也可以 图标样列查询 "},{"id":75,"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/","title":"无缝滚动","section":"特殊图形","content":" 通用滚动 # 例如你的html如下\n\u0026lt;div id=\u0026#34;smtid\u0026#34; style=\u0026#34;height:100%\u0026#34;\u0026gt; \u0026lt;ul\u0026gt; \u0026lt;li\u0026gt;smartchart\u0026lt;/li\u0026gt; \u0026lt;li\u0026gt;bigdata\u0026lt;/li\u0026gt; \u0026lt;li\u0026gt;echarts\u0026lt;/li\u0026gt; \u0026lt;li\u0026gt;make it great\u0026lt;/li\u0026gt; \u0026lt;/ul\u0026gt; \u0026lt;/div\u0026gt; 你只需要在图形中使用以下函数, 即可实现在无缝滚动\n//smtid是滚动容器的ID ds_liMarquee(\u0026#39;#smtid\u0026#39;) //如果 class=\u0026#34;smtclass\u0026#34;, 那么也可以使用类选择器 ds_liMarquee(\u0026#39;.smtclass\u0026#39;) 我们也可以使用更多的配置方法\nmarconfig={ playtime: 3000, //滚动3秒 pausetime: 3000, //停3秒 config:{ direction: \u0026#39;up\u0026#39;,//向上滚动 runshort: false,//内容不足时不滚动 scrollamount: 20//速度 } } //传入自定义配置 ds_liMarquee(\u0026#39;#smtid\u0026#39;, marconfig) 更多config说明:\n名称 类型 默认值 说明 direction 字符串 left 滚动方向，可选 left / right / up / down loop 整数 -1 循环次数，-1 为无限循环 scrolldelay 整数 0 每次重复之前的延迟 scrollamount 整数 50 滚动速度，越大越快 circular 布尔值 true 无缝滚动，如果为 false，则和 marquee 效果一样 drag 布尔值 true 鼠标可拖动 runshort 布尔值 true 内容不足是否滚动 hoverstop 布尔值 true 鼠标悬停暂停 xml 布尔值 false 加载xml 文件 inverthover 布尔值 false 反向，即默认不滚动，鼠标悬停滚动 内置滚动表格 # smartchart内置了滚动表格, 可以一键生成\n样式自定义 # 如需修改表格的样式, 如字体,颜色等, 可以在模板中重定义样式 具体样式写法, 参考 样式快速入门\n/*表头样式*/ .smtlisthead{ background: #fff2cc; color: red; height: 5rem; } .smtlisthead span{ height: 5rem; } /*表格本体样式*/ .smtlistnav{ height: calc(100% - 5rem); color: red; overflow: auto; } .smtlistnav li span{ height: 3rem; } /*修改奇数行背景,偶数行将odd改为even*/ .smtlistnav ul li:nth-child(odd){ background: rgba(100,100,100,.1);} 指定某单元格宽度对齐 # \u0026lt;span\u0026gt; \u0026lt;span style=\u0026#34;width:32rem;height:100%;flex-shrink:0;justify-content:left\u0026#34;\u0026gt;\u0026lt;span\u0026gt; \u0026lt;/span\u0026gt; 单元格点击响应 # let lastClickDom; let lastDomColor; $(\u0026#39;#smtlist__name__, li\u0026#39;).click(function(params){ try{lastClickDom.css(\u0026#39;background\u0026#39;, lastDomColor)}catch{} lastDomColor = $(this).css(\u0026#39;background\u0026#39;); $(this).css(\u0026#39;background\u0026#39;, \u0026#39;yellow\u0026#39;); lastClickDom = $(this); let myparam = $(this).children(\u0026#39;span\u0026#39;).eq(0).text(); //获取点击的参数 //以下加入你的action }); "},{"id":76,"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/","title":"特殊图形加载","section":"特殊图形","content":"smartchart默认只会引echarts的基础图形, 如需使用更多图形,可在模板javascript标签中自行引用\n中国地图 \u0026lt;script src=\u0026#34;/static/smartchart/opt/smt_china.js\u0026#34;\u0026gt;\u0026lt;/script\u0026gt; 世界地图 \u0026lt;script src=\u0026#34;/static/smartchart/opt/smt_world.js\u0026#34;\u0026gt;\u0026lt;/script\u0026gt; 统计图 \u0026lt;script src=\u0026#34;/static/smartchart/opt/smt_ecStat.js\u0026#34;\u0026gt;\u0026lt;/script\u0026gt; 水球图 \u0026lt;script src=\u0026#34;/static/smartchart/opt/smt_liquidfill.js\u0026#34;\u0026gt;\u0026lt;/script\u0026gt; 词云 \u0026lt;script src=\u0026#34;/static/smartchart/opt/smt_wordcloud.js\u0026#34;\u0026gt;\u0026lt;/script\u0026gt; 百度地图 \u0026lt;script type=\u0026#34;text/javascript\u0026#34; src=\u0026#34;https://fastly.jsdelivr.net/npm/echarts@5/dist/extension/bmap.min.js\u0026#34;\u0026gt;\u0026lt;/script\u0026gt; "},{"id":77,"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/","title":"Jupyter中使用指引","section":"9. Jupyter应用","content":" 应用场景 # 你需要在jupyter中通过smartchart分享的数据集获取数据进行分析 你有很多线下数据需要进行个性化分析, 然后制做仪表盘 在Jupyter的数据分析过程中, 你需要快速生成图形 大屏或报表有部分数据集是需要能过复杂的分析生成的\nSmartchart支持像pyecharts, Matplotlib 等python绘图工具一样在Jupyter中使用, 但她更加方便, 更加炫酷 和 通用化, 不仅仅是一个绘图工具, 而且是一个平台\n我们有什么特色:\n使用上手非常简单, 仅仅只有两个命令, get and set, 配置项采用原生的Echarts配置, 无重复学习成本, 使用顺滑 支持Echarts所有功能, 可定制化程度高, 显示效果好, 可嵌入也可以弹出窗口显示, 也可以dashboard中显示 数据可以固化存储, 采用smartchart Portal可以直接拼接炫酷大屏\nSmartchart与Pandas Smartchart与Jupyter SmartChart大屏新思路\n安装使用方法 # 你需要在jupyter相同的python环境中安装smartchart客户端 pip install smartchart 或pip3 install -i https://pypi.tuna.tsinghua.edu.cn/simple smartchart 如果你只是需要连接已部署好的smartchart服务端, 本地无需启动smartchart 快速开始 # 初始化认证: 第一次使用时, 打开jupyter后, 需要设定默认用户和smartchart服务端url 同一个环境, 只需初始化一次, 后面无需再设定\nfrom smart_chart import Smart Smart().set_auth(\u0026#39;用户名\u0026#39;, \u0026#39;密码\u0026#39;,url = \u0026#39;http://xxxxx\u0026#39;) 如果smartchart服务端在本地, 可以省略url\nSmart().set_auth(\u0026#39;用户名\u0026#39;, \u0026#39;密码\u0026#39;) 使用方法:\nfrom smart_chart import Smart mysmart = Smart() dataset = [[\u0026#39;A\u0026#39;,\u0026#39;B\u0026#39;,\u0026#39;C\u0026#39;],[12,34,23],[22,33,37]] #把数据写入临时数据集并显示图形 mysmart.set(1,dataset) #随意命名临时数据集, 不一定需要smartchart中数据集已有的 mysmart.set(\u0026#39;DD\u0026#39;, dataset) #从已有的数据集中获取数据(格式参考smartchart数据集) ds1 = mysmart.get(1) ds2 = mysmart.get(\u0026#39;DD\u0026#39;) 修改图形显示 # 方法一: 你可以在图形菜单中选择内置图形或主题 方法二: set默认是表格显示,你也可通过名称加前缀 bar, line, pie进行修改\nmysmart.set(\u0026#39;barxxx\u0026#39;, dataset) #显示柱形图, 另外还有linexxx, piexxx 方法三: 简单图形,可能无法满足你的个性化要求, 你可以采用实例化数据集的方式后做出炫酷的自定义图形\nmysmart.set(\u0026#39;myds_1\u0026#39;, dataset, push=1) #参数push=1, 将实例化数据集 实例化的数据集, 在图形编辑区点击, 可以进入定制化图形开发, 可使用原生的Echarts配置和实时调试,或直接使用社区图形(第一次使用,有一个登记的过程, 按提示进行) 方法四: 如何在非实例化的数据集中使用自定义图形进行临时显示 假如你已经实例化并自定义了图形, 比如 \u0026lsquo;myds_1\u0026rsquo;, 你可以直接用它的名称来set\n#不加push, 将使用新的数据采用myds_1的图形临时显示, 而不会改变原myds_1的数据 mysmart.set(\u0026#39;myds_1\u0026#39;, dataset) 显示设定参数 # 你可以通过参数来设定图形的高宽, 是否嵌入等个性化要求\n# width, height指定图形嵌入显示的宽高 # embed 默认不嵌入, embed=1 嵌入, embed=0 不嵌入 # editor 是否显示图形菜单, 1显示, 0不显示 # push 是否持久化数据集 push=1, 无则新建有则保存数据 # url 报表访问的url,默认是localhost #可以全局初始化设定 mysmart = Smart(width=xx, height=xx, embed=1, editor=\u0026#39;\u0026#39;) #也可以全局单独进行设定 mysmart.url = \u0026#39;http://ip:8000\u0026#39; mysmart.embed = 1 #也可以针对单独的一个图形设定 mysmart.set(1,dataset,embed=1,height=200,editor=0) SmartChart与Pandas # Smartchart的set支持直接set Pandas的dataframe对象\nfrom smart_chart import Smart import pandas as pd mysmart = Smart() df = pd.read_excel(\u0026#39;manual_smartdemo.xlsx\u0026#39;, \u0026#39;sheet1\u0026#39;) mysmart.set(\u0026#39;excelsample\u0026#39;, df.sample(10)) df1 = df.groupby(\u0026#39;province\u0026#39;).agg({\u0026#39;qty\u0026#39;:\u0026#39;sum\u0026#39;}).reset_index() mysmart.set(\u0026#39;ec_df1\u0026#39;, df1, push=1) df2 = df.groupby(\u0026#39;c1\u0026#39;).agg({\u0026#39;qty\u0026#39;:\u0026#39;sum\u0026#39;}).reset_index() mysmart.set(\u0026#39;ec_df2\u0026#39;, df2, push=1) df4 = df.groupby(\u0026#39;province\u0026#39;).agg({\u0026#39;qty\u0026#39;:\u0026#39;count\u0026#39;}).reset_index() mysmart.set(\u0026#39;ec_df4\u0026#39;, df1, push=1) df3 = df.groupby(\u0026#39;c3\u0026#39;).agg({\u0026#39;qty\u0026#39;:\u0026#39;sum\u0026#39;}).reset_index() print(df3) df3.loc[1, \u0026#39;qty\u0026#39;] = df3.loc[1, \u0026#39;qty\u0026#39;] * 100 print(df3) mysmart.set(\u0026#39;ec_df3\u0026#39;, df3, push=1) #mysmart.set(\u0026#39;pie0\u0026#39;, df1) #df2 = df.groupby([\u0026#39;province\u0026#39;,\u0026#39;c3\u0026#39;]).agg({\u0026#39;qty\u0026#39;:\u0026#39;sum\u0026#39;}).reset_index() #print(df2) #mysmart.set(\u0026#39;ssss\u0026#39;, df2) #print(mysmart.get(15)) "}]
\ No newline at end of file
diff --git a/docs/en.search-data.min.76743e701847269b6e3a92d8a5dc29d64a2bd8b29421c692138c3702977e76b3.json b/docs/en.search-data.min.76743e701847269b6e3a92d8a5dc29d64a2bd8b29421c692138c3702977e76b3.json
deleted file mode 100644
index c3f321c..0000000
--- a/docs/en.search-data.min.76743e701847269b6e3a92d8a5dc29d64a2bd8b29421c692138c3702977e76b3.json
+++ /dev/null
@@ -1 +0,0 @@
-[{"id":0,"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/","title":"使用 Vue","section":"Vue相关","content":" 使用场景 # 报表中涉及交互场景较多, 需要数据与页面绑定 开发者熟悉vue 常见绑定 # //显示变量message \u0026lt;p\u0026gt;{[ message ]}\u0026lt;/p\u0026gt; //循环产生li,变量sites \u0026lt;ol\u0026gt; \u0026lt;li v-for=\u0026#34;site in sites\u0026#34;\u0026gt; {[ site.name ]} \u0026lt;/li\u0026gt; \u0026lt;/ol\u0026gt; //绑定输入值变量use \u0026lt;input type=\u0026#34;checkbox\u0026#34; v-model=\u0026#34;use\u0026#34;\u0026gt; //显示控制 \u0026lt;p v-if=\u0026#34;seen\u0026#34;\u0026gt;现在你看到我了\u0026lt;/p\u0026gt; \u0026lt;p v-show=\u0026#34;seen\u0026#34;\u0026gt;现在你看到我了\u0026lt;/p\u0026gt; //绑定属性 \u0026lt;a :href=\u0026#34;url\u0026#34;\u0026gt;\u0026lt;/a\u0026gt; \u0026lt;div :style=\u0026#34;{ color: activeColor, fontSize: fontSize + \u0026#39;px\u0026#39; }\u0026#34;\u0026gt;\u0026lt;/div\u0026gt; \u0026lt;div :class=\u0026#34;[errorClass ,isActive ? activeClass : \u0026#39;\u0026#39;]\u0026#34;\u0026gt;\u0026lt;/div\u0026gt; //绑定点击方法 \u0026lt;a @click=\u0026#34;doSomething\u0026#34;\u0026gt;\u0026lt;/a\u0026gt; 开启VUE # 需要在设定\u0026ndash;\u0026gt;高级设定中可开启vue模式\n简单赋值应用 # 系统默认为初始vue及内置vue的data有17个变量(从d0, d1\u0026hellip; d16) 你可以在图形编辑器中给vue的变量赋值, 赋值方式:\nvapp.d0 = xxxx 你可以将d0赋值为字典, 如:\nvapp.d0 = { \u0026#39;index1\u0026#39;: 100, \u0026#39;index2\u0026#39;: 300} 注意,我们修改了vue在模板中变量的默认引用方式, 你需要采用如下方法引用: {[d0.index1]}\n使用模板可以更方便使用VUE # 你也可以在 模板开发中 使用VUE 开启方法, 首先你需要在高级设定中开启模板功能, 然后你可以看到 模板 的菜单, 进入编辑器\n如果你需要更多自定义的方法, 例如加入方法, 你可以在模板的script中加入自定义代码\n\u0026lt;script\u0026gt; var vapp = new Vue({el: \u0026#39;#vue_app\u0026#39;, delimiters: [\u0026#39;{[\u0026#39;, \u0026#39;]}\u0026#39;], data: { tableData:\u0026#39;\u0026#39; }, methods: { formatter(row, column) { return row.address; } } }); \u0026lt;/script\u0026gt; "},{"id":1,"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/","title":"主题应用 Pro","section":"不太重要","content":"点击smartchart图标,切换到菜单固定模式, 你可看到主题的选择 "},{"id":2,"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/","title":"快速开始","section":"Linux","content":" 涉及的基础环境和版本： # * Centos 7 * Python 3.9 /data/smartchart/ 项目主目录 /data/smartchart/tools 项目相关软件 下述内容中，凡是涉及到/data/smartchart路径的，都可以将其修改为你自己系统上的路径。 安装环境 # 安装Python # cd /data/smartchart/tools yum -y install zlib-devel bzip2-devel openssl-devel ncurses-devel sqlite-devel readline-devel tk-devel gdbm-devel db4-devel libpcap-devel xz-devel libffi-devel 下载https://npm.taobao.org/mirrors/python/3.9.0/ 上传服务器，放入安装目录解压 或者 Wget https://npm.taobao.org/mirrors/python/3.9.0/Python-3.9.0.tgz tar -zxvf Python-3.9.0.tgz 进行源码目录 配置安装路径 ./Python-3.9.0/configure --prefix=/data/smartchart/tools/python3 编译安装 make \u0026amp;\u0026amp; make install 建立软链接 ln -s /data/smartchart/tools/python3/bin/python3.9 /usr/bin/python3 ln -s /data/smartchart/tools/python3/bin/pip3.9 /usr/bin/pip3 测试是否安装成功 python3 --version 建立python虚拟环境 # python3 -m venv myvenv cd myvenv source bin/activate 在虚拟环境中安装smartchart # pip3 install -i https://pypi.tuna.tsinghua.edu.cn/simple smartchart -U 启动smartchart(测试部署), 企业部署方式可有尝咨询 # smartchart runserver 0.0.0.0:8000 --insecure --noreload "},{"id":3,"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/","title":"数据集开发界面","section":"2.数据集说明","content":"开发前建意先观看视屏, 了解基础说明, 视屏有点老和现在界面不一样, 目前很多功能已经做成可视化配置, 理解过程即可, 具体以文档为准\nSmartchart数据集与图形 从仪表盘界面中进入简易开发界面 # "},{"id":4,"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/","title":"Api数据集","section":"特殊数据源","content":"对接外部API取数, 注意返回一定要是JSON格式 你只需要在数据集编辑框中如下输入\n//GET 方法: dataset= { \u0026#34;url\u0026#34;:\u0026#34;https://www.smartchart.cn/smartdata/api/?i=loaddataset1\u0026amp;j=1\u0026#34; } //POST 方法: dataset= { \u0026#34;url\u0026#34;:\u0026#34;https://www.smartchart.cn/smartdata/api\u0026#34;, \u0026#34;method\u0026#34;:\u0026#34;POST\u0026#34;, \u0026#34;data\u0026#34;:{\u0026#34;i\u0026#34;:\u0026#34;loaddataset1\u0026#34;, \u0026#34;j\u0026#34;:\u0026#34;1\u0026#34;} ... } 例如你可以传入参数做出联动效果\ndataset= { \u0026#34;url\u0026#34;:\u0026#34;https://www.smartchart.cn/smartdata/api\u0026#34;, \u0026#34;method\u0026#34;:\u0026#34;POST\u0026#34;, \u0026#34;data\u0026#34;:{\u0026#34;i\u0026#34;:\u0026#34;loaddataset1\u0026#34;, \u0026#34;j\u0026#34;:\u0026#34;/*$参数名*/\u0026#34;} ... } 你也可以增加header等认证方式\ndataset= { \u0026#34;url\u0026#34;:\u0026#34;https://www.smartchart.cn/smartdata/api\u0026#34;, \u0026#34;method\u0026#34;:\u0026#34;GET\u0026#34;, \u0026#34;headers\u0026#34;:{\u0026#34;Cookie\u0026#34;:\u0026#34;xxxxxxx\u0026#34;} ... } "},{"id":5,"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/","title":"使用 Excel数据","section":"特殊数据源","content":" 使用固定数据集 # 有一些场景, 比如已有一些固定的筛选器,或是需要测试用,或者Demo,或者其它图形需要用到一些共用的已确定好的数据 这样我们可以不需要通过查询数据库的方式, 而直接写入数据集, 支持数组和字典的格式 你只需要在数据集中起始写入 dataset= , 这样就是默认是固定数据\n如何快速的输入固定数据集, 你可以通过直接从EXCEL复制到数据集编辑器(以下图片非目前编辑器, 供参考),保存以后会自动生成: 固定数据集也支持之前提到传参数, 魔术方法, 缓存等所有数据集的功能 上传文件的方式使用 # 用户如何上传文件 # smartchart默认是不自带文件上传功能 但是smartchart是可以自已创造上传页面, 在模板商店中你可以找到相关模板进行购买 然后通过模板下载的方式下载后进行操作 这样每一个页面是可以单独使用权限控制的,就和控制报表权限一样,你还可能按需随意定制页面\n关于上传文件的路径 # 默认的上传主目录是在项目的log的文件夹下面, 你可以在setting.py(自定义django) 或 config.ini中设定UPLOAD_PATH来修改你的上传目录 比如你上传页面的报表ID是23, 那么文件将会被上传到UPLOAD_PATH/23/你的文件名\n如何使用上传的文件 # 你需要使用 python连接器, 来操作你的上传的数据, 内置了变量ds_path为你的上传目录, 所以可以更方便的读取上传的文件,如上文件 df = pd.read_excel(ds_path+\u0026rsquo;/23/文件名')\n"},{"id":6,"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/","title":"图形端数据函数","section":"函数方法","content":" 应用场景 # 在图形开发中，我们可能需要使用js对传递过来的数据进行处理\n原始数据格式 # 假设dataset的格式是, SQL = Select 维度1,维度2,数据 from xxxx, 生成的数据集如下\ndataset = [[\u0026#39;category\u0026#39;,\u0026#39;C1\u0026#39;,\u0026#39;C2\u0026#39;], [\u0026#39;R1\u0026#39;, 12, 18], [\u0026#39;R2\u0026#39;, 10, 17] ] 常用转化函数 # 生成字典表示为key-\u0026gt;[], 常用于定制化高的图形 # result = ds_createMap(dataset) 结果 = {\u0026#34;category\u0026#34;:[\u0026#39;C1\u0026#39;,\u0026#39;C2\u0026#39;], \u0026#34;R1\u0026#34; : [12, 10], \u0026#34;R2\u0026#34; : [18, 17]} 生成非常多前端组件要求的格式 # result = ds_createMap_all(dataset) 结果 = [{\u0026#34;category\u0026#34;:\u0026#34;R1\u0026#34;, \u0026#34;C1\u0026#34;: 12, \u0026#34;C2\u0026#34;: 18}, {\u0026#34;category\u0026#34;:\u0026#34;R2\u0026#34;, \u0026#34;C1\u0026#34;: 10, \u0026#34;C2\u0026#34;: 17}] 获取列名list, 用于获取系列名 # result = ds_rowname(dataset) 结果 = [\u0026#39;R1\u0026#39;,\u0026#39;R2\u0026#39;] 将数据集行列转化, 一般用于坐标轴翻转 # result = ds_transform(dataset) 结果 = [[\u0026#39;category\u0026#39;,\u0026#39;R1\u0026#39;,\u0026#39;R2\u0026#39;], [\u0026#39;C1\u0026#39;, 12, 10], [\u0026#39;C2\u0026#39;, 18, 17]] 两个数据集左关联, 常用于将两段查询数据合并 # //假设需要关联的数据集格式： dataset2 = [[\u0026#39;category\u0026#39;,\u0026#39;C3\u0026#39;], [\u0026#39;R1\u0026#39;, 38], [\u0026#39;R6\u0026#39;, 13]] //处理后的结果： result = ds_leftjoin(dataset, dataset2) 结果 = [[\u0026#39;category\u0026#39;,\u0026#39;C1\u0026#39;,\u0026#39;C2\u0026#39;,\u0026#39;C3\u0026#39;], [\u0026#39;R1\u0026#39;, 12, 18, 38], [\u0026#39;R2\u0026#39;, 10, 17, 0] ] 数据集旋转，在excel中叫透视表 # //比如需要将dataset3的户型变成指标 dataset3 = [[\u0026#39;城市\u0026#39;,\u0026#39;户型\u0026#39;,\u0026#39;数量\u0026#39;], [\u0026#39;长沙\u0026#39;,\u0026#39;A\u0026#39;,35], [\u0026#39;上海\u0026#39;,\u0026#39;B\u0026#39;,19]] //处理后的结果： result = ds_pivot(dataset3) 结果 = [[\u0026#34;城市\u0026#34;,\u0026#34;A\u0026#34;,\u0026#34;B\u0026#34;], [\u0026#34;长沙\u0026#34;,35,0], [\u0026#34;上海\u0026#34;,0,19]] 移除数据集中的某几列 # //比如移除第1列（序号0） result=ds_remove_column(dataset,remove_list=[0]) 结果 = [[\u0026#39;R1\u0026#39;,\u0026#39;R2\u0026#39;], [12, 10], [18, 17] ] 图形中可用转化函数 # 函数名 函数说明 样列 ds_transform(dataset) 行列替换 ds_split(data,sep=\u0026rsquo;,\u0026rsquo;,head_add=[]) 将第一列拆分成多个字段,默认逗号分隔, 如果不传表头,取SQL中的字段名拆分 ds_createMap(data) data表示传入的二位数组,生成结果表示为key-\u0026gt;[], 常用于echarts指定数据 ds_createMap_all(data) data表示传入的二维数组,生成结果表示为[{A:A1,B:B1,C:C1},{A:A2,B:B2,C:C2}\u0026hellip;] ds_mapToList(data) 将createMap_all的格式还原成二维数组, 常用于将nosql(mongodb,es..)数据源数据处理 ds_rowname(dataset,start_row=1,column=0) 获取指定列的数据, 默认取第一列从第二行(序号1)开始的数据,常用于获取维度 ds_remove_column(dataset,remove_list=[0]) 默认移除第一列, 也要移除指定的多个列 ds_toThousands(num) 转逗号分隔的千分位 ds_distinct(a, b=[]) 对单个或多个二维数组去重 ds_leftjoin(a,b,withhead=true,type=1) 两个数组join [[1,2,3,4],[2,3,4,5]] ,[[2,3,4]], 如果带头,合并头 ds_crossjoin(a,b,withhead=true) ds_fulljoin(a,b,withhead=true) ds_union(a,b,withhead=true) 合并两个数据集, 可选是否带头, 取第一个数据集的头, 去除第二个头 ds_pivot(arr) 传入二维数组(维度, 维度, 值), 将第二列的维度转为列 ds_sort(arr, index=0, asc=true) 指定二维数组列序号排序,默认升序,index参数也可以是函数,如(a,b)=\u0026gt;{return a.qty - b.qty} ds_round(num,qty=2) 小数点处理, 默认保留两位小数 ds_param(name) 传入参数名,获取图形点击时传递来的参数值 ds_setParam(\u0026lsquo;参数名\u0026rsquo;, 参数值) 设定全局参数, 此方法将自动判断当参数值为空时, 删除参数回到初始未传参状态 ds_refresh(id, param=filter_param) 刷新图形, id为图形序号,默认采取全局参数刷新,也可指定param,参数为字典{\u0026ldquo;参数名\u0026rdquo;:\u0026ldquo;值\u0026rdquo;,\u0026hellip;} ds_excel_refresh(dataset) 刷新复杂报表, dataset格式:{df0:二维数组, df1:二维数组,..} ds_excel_value(fillCells,clear=false) 指定单元格获取复杂报表中的数据, fillcells格式:[\u0026lsquo;A1\u0026rsquo;,\u0026lsquo;B2\u0026rsquo;],一般用于数据填报 常用JS原生函数 # //数组追加 dataset.push(item) //数组前方插入 dataset.unshit(item) //切片 dataset = dataset.slice(1) 从序号1个开始到最最后一个 dataset = dataset.slice(5, 10) 从第序号5开始截取到第10个 dataset = dataset.slice(-3) 截取最后三个元素 //循环遍历 //for最快，但可读性比较差(smartchart推荐) //forEach比较快，能够控制内容 //for...in比较慢，不方便 for(let i=0; i\u0026lt;dataset.length; i++){ } 其它方法 # 多维度的数据透视 # 常规数据集中提到 A类数据源的情况, 格式都是: 维度A 维度B 数据 但还有情况比如你有一个数据格式是: 维度A 维度B 维度C 数据 你需要在表格中将 A,B维度做维度, 但C做透视为指标名进行展示 由于我们的数据透视只支持\u0026#34;字符, 字符, 数值\u0026#34;的SQL写法, 所以如果要多维, 我们需要做下转变, 可以写成: select concat_ws(\u0026#39;,\u0026#39;,维度A,维度B) AS 维度,维度C,SUM(数据) AS 度量 from tablename group by 维度, 维度C 得到的数据样式 dataset=[[\u0026#39;维度\u0026#39;,\u0026#39;C1\u0026#39;,\u0026#39;C2\u0026#39;....] ,[\u0026#39;A1,B1\u0026#39;,1,1...] ,[\u0026#39;A2,B2\u0026#39;,2,2...]] 最终在图形数据集处理中, 我们可以使用如下函数进行转化: dataset = ds_split(dataset,\u0026#39;,\u0026#39;,[\u0026#39;维度A\u0026#39;,\u0026#39;维度B\u0026#39;]) \u0026#39;,\u0026#39; : 参数为分隔符 [\u0026#39;维度A\u0026#39;,\u0026#39;维度B\u0026#39;] : 指第一个字段需要拆分的表头名称 最终得到的数据就是多维度透视 [[\u0026#39;维度A\u0026#39;,\u0026#39;维度B\u0026#39;,\u0026#39;C1\u0026#39;,\u0026#39;C2\u0026#39;....] ,[\u0026#39;A1\u0026#39;,\u0026#39;B1\u0026#39;,1,1...] ,[\u0026#39;A2\u0026#39;,\u0026#39;B2\u0026#39;,2,2...]] "},{"id":7,"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/","title":"基础图形","section":"3.图形开发","content":" 快速应用基础图形组件 # 你可使用如下方式选择\u0026quot;图形\u0026quot;\u0026ndash;\u0026gt;\u0026ldquo;基础图形\u0026rdquo; 点击即可一键进行应用 可以在图形商店中找到更多已转化好的Smartchart图形 我们只放了基础图形,因为你可以通过简单修改配置转化为各种图形,如线性面积图, 柱形堆叠图.. 理解ECharts基础概念 # 只需要围绕option进行定制设定。echarts使用 option 来描述其对图表的各种需求，包括：有什么数据、要画什么图表、图表长什么样子、含有什么组件、组件能操作什么事情等等。简而言之，option 表述了：数据、数据如何映射成图形、交互行为。\n系列（series） # 组件（component） # 在系列之上，echarts 中各种内容，被抽象为“组件”。例如，echarts 中至少有这些组件：xAxis（直角坐标系 X 轴）、yAxis（直角坐标系 Y 轴）、grid（直角坐标系底板）、angleAxis（极坐标系角度轴）、radiusAxis（极坐标系半径轴）、polar（极坐标系底板）、geo（地理坐标系）、dataZoom（数据区缩放组件）、visualMap（视觉映射组件）、tooltip（提示框组件）、toolbox（工具栏组件）、series（系列）、\u0026hellip; 组件的定位 # 多数组件和系列，都能够基于top / right / down / left / width / height 绝对定位(坐标基于echarts容器)。\n其中，他们每个值都可以是： 绝对数值（例如 bottom: 54 表示：距离 echarts 容器底边界 54 像素）。 或者基于 echarts 容器高宽的百分比（例如 right: \u0026lsquo;20%\u0026rsquo; 表示：距离 echarts 容器右边界的距离是 echarts 容器宽度的 20%）。 如下图的例子，对 grid 组件（也就是直角坐标系的底板）设置 left、right、height、bottom 达到的效果。 坐标系 # 如下图, 不同系列映射到不同的坐标系 快速应用配置项 # 在您理解了echarts的配置方法后,你可以在\u0026quot;参考\u0026quot;的菜单中找到对应的常用参考项 Echarts的配置项目非常多, 如果需要更多配置, 您可以参考 速查手册\n注意事项 # 对于一些特殊图形,如地图, 在图形编辑中,需要进行动态加载 你可在图形编辑器使用ds_loadjs(\u0026lsquo;smt_china’)加载中国地图 同理我们有 \u0026lsquo;smt_wordcloud\u0026rsquo;, \u0026lsquo;smt_world\u0026rsquo;, \u0026lsquo;smt_ecStat\u0026rsquo;, ‘smt_liquidfill’ 有些图形可能同时需要在模板中加载, 更多特殊图形加载说明参考 特殊图形模板加载 "},{"id":8,"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/","title":"布局指引","section":"4.布局说明","content":" SmartChart布局说明 # 推荐先观看视屏了解 smartchart布局方式\n容器说明 # 容器 说明 定位容器 用于图形定位, 有拖拽和栅格两种. 在界面上新增时会自带;在模板编辑中新增图形时需自行加入容器 图形容器 用于图形选择, 使用id选择器, 如序号为2的容器, 选择器为#container_2 图形 可视化的实际单位, 如选择图形中的table标签, 可使用#container_2 table 6.0版本中拖拽布局方式已可同时满足电脑端/移动端的需求\n响应式布局 # 当你新增一个栅格图形时, smartchart会给你一段默认的代码\n\u0026lt;div class=\u0026#34;el-col-xs-24 el-col-md-24\u0026#34; style=\u0026#34;padding:0.2rem;height:50%;\u0026#34; \u0026gt; \u0026lt;div style=\u0026#34;height:100%;\u0026#34; id=\u0026#34;container_{name}\u0026#34;\u0026gt;\u0026lt;/div\u0026gt; \u0026lt;/div\u0026gt; el-col-md-24 : 电脑端宽度设定 控制图形父容器的宽度, 整行分成24个栅格, 如果你想让图形占一半, 就可以改成el-col-md-12 el-col-xs-24 ：移动端宽度设定 padding:0.5% 0.5%: 控制图形的上下, 左右内边距, padding: 上 右 下 左 比如你想要图形在容器中往下走一点, 你可写成 padding: 1% 0 0 0 height:50%; 盒子的高度, 相对于父容器的高度， 最外层即浏览器高度 推荐使用拖拽布局（PRO) # 只是用响应式布局可能对于复杂的布局不是很方便, 你也可以采用拖拽绝对定位的方法, 这样你可以随意指定图形的所在位置. 方法可参考视屏 拖拽说明 你可以配合使用 ”模板开发“ 来实现高度定制化的效果， 参考 模板开发指引\n混合布局(PRO) # 你可以考虑先用响应式布局把整体框架画出来, 如果要加一下装饰的情况, 可以用绝对定位(拖拽布局)来实现\n"},{"id":9,"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/","title":"参数编写方法","section":"5.参数及联动钻取","content":" 使用场景 # 需要使用图表联动效果 数据服务接口开发 使用魔法方法(smartchart独创,拒绝抄袭) # 基础原理 # 1. $参数名 : 当有传递参数时将替换相关的值 2. /* ... $参数名 ... */ : 当参数写在这个区间时, 如果外部没有传入参数, 会自动忽略这一段代码 3. -- : 标识之后单行的代码会被忽略 常见组合应用 # 理解以下样列后, 可录活使用组合出各种可能的需求\n默认参数: 实现在不传参数时默认参数是当前月份 select xx from tablename where calmonth =/*\u0026#39;$calmonth\u0026#39; -- */ to_char(sysdate,\u0026#39;YYYYMM\u0026#39;) 多个参数: 注意使用1=1及and的位置 select xx from tablename where 1=1 /* and city = \u0026#39;$city\u0026#39; */ /* and calmonth =\u0026#39;$calmonth\u0026#39;*/ 维度变化: 将字段当成参数 select /*$calmonth,*/ city, count(1) as qty from tablename group by /*$calmonth,*/ city 维度变化: 当传入月份条件时, 按城市,月份的数据, 不传参数时只看按城市的总数 select /*月份, -- $Month */ 城市, sum(度量) from tablename where 1=1 /* and 月份 \u0026gt; \u0026#39;$Month\u0026#39; */ group by 城市 /*,月份 -- $Month*/ 高级开关应用 # 以上应用可以通过参数是否有传递来实现开关代码段的效果, 有些场景可能还希望通过参数值来进行代码段的开关 如下代码可以实现当传递参数type=1 或 type=2 时执行不同的代码段 使用 \u0026ldquo;$参数__值\u0026rdquo; 的方式做为开关\n/* select count(1) as qty from tablename1 $type__1*/ /* select count(1) as qty from tablename2 $type__2*/ 再比如 当参数D传值为\u0026quot;月份\u0026quot;时是统计2022年按月的统计, 传\u0026quot;日期\u0026quot;时统计的是2022年10月按天的统计\nselect $D, count(1) as qty from tablename where 1 = 1 /* and year=\u0026#39;2022\u0026#39; -- $D__日期 $D__月份 */ /* and month=\u0026#39;10\u0026#39; -- $D__日期 */ group by $D 加了\u0026quot;\u0026ndash;\u0026ldquo;是为了避免语法错误\n数据集开发调试参数方法 # 对于开发人员来说, 带参数的SQL调试不方便, 所以支持你在sql中写入默认参数 方法如下格式, 你可以在sql编辑器的最上方写上 /* {xxxxxx} */, 会默认在开发调试模式下取这些参数, 在用户模式下会忽略\n/* {\u0026#34;月份\u0026#34;:\u0026#34;202009\u0026#34;,\u0026#34;城市\u0026#34;:\u0026#34;中山\u0026#34;} */ select xxx from table xxx 数据权限行级别控制 # 当你在sql查询中加上\u0026rsquo;$username\u0026rsquo;, 会自动替换成登录用户的用户名 如果你是嵌入到第三方系统, 你可以通过url传递参数id, 在后台会转化为参数_id, 在sql中配置$_id即可控制数据权限 可以采用此做数据权限关联后台权限mapping表进行数据权限控制实现不同人看不同的数据 参数的传递方式 # 你可以从url传入参数, 在url上加入 \u0026amp;param={\u0026ldquo;参数名\u0026rdquo;:\u0026ldquo;参数值\u0026rdquo;} 在图形联动的点击过程中会自动传递参数， 具体参考联动相关文档 TIPS 当设定参数后, 联动过程dataset的缓存功能失效, 所以不要让带参数的查询设计得太慢 参数如果存在一些非法字符可能会有问题, 比如参数中不可以有#号\n"},{"id":10,"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/","title":"模板开发界面","section":"低代码开发","content":" 低代码化开发 # smartchart的标准模板为了标准化的原因,对于引用JS,编写CSS等有一定不方便性, 但有时候你可能需要放飞自由, 随意定制 你甚至可能想引用一些其它的UI组件, 所以smartchart给你一个原汗原味的开发空间\n开启方式 # 在高级设定中开启模板 主菜单中会多出来一个 模板 的功能 进入模板编辑界面 "},{"id":11,"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/","title":"简单嵌入","section":"7.报表嵌入","content":"你可能需要把Smartchart生成的图形嵌入到其它系统 首先，所有smartchart设计出来的仪表盘都有一个访问url 你可以直接访问：\nhttp://localhost:8000/echart?type=仪表盘名称 如：http://localhost:8000/echart?type=demo 但是smartchart默认是有权限管理的，所以如果你需要嵌入你自已的系统又不考虑权限，你可以在“设定” \u0026ndash;\u0026gt; 公开 然后在你的网页就可以直接iframe了\n\u0026lt;iframe src=\u0026#34;http://localhost:8000/echart?type=demo\u0026#34; style=\u0026#34;width:100%;height:100%\u0026#34;\u0026gt;\u0026lt;/iframe\u0026gt; "},{"id":12,"href":"/docs/8.Django%E5%BA%94%E7%94%A8/%E5%B5%8C%E5%85%A5Django-Apps/","title":"嵌入 Django Apps","section":"8. Django应用","content":" 应用场景 # 你可以在你的django项目中直接使用smartchart做为插件的方式 你可以查看相关视屏\n使用方法 # 在你的setting.py的INSTALL_APPS中加入\u0026rsquo;smart_chart.echart' 如果你需要simpleui, 你可以在最上行加入我们适配好的\u0026rsquo;smart_chart.smartui\u0026rsquo; INSTALLED_APPS = [ \u0026#39;smart_chart.smartui\u0026#39;, .... .... \u0026#39;smart_chart.echart\u0026#39; ] MIDDLEWARE 中注释掉XFrameOptionsMiddleware\n检查确保在Templates的设定处有DIRS的相关设定\nTEMPLATES = [ { \u0026#39;BACKEND\u0026#39;: \u0026#39;django.template.backends.django.DjangoTemplates\u0026#39;, \u0026#39;DIRS\u0026#39;: [BASE_DIR / \u0026#39;templates\u0026#39;], #此处需要有 \u0026#39;APP_DIRS\u0026#39;: True, #也要有 ..... }, ] setting.py中设定为中国时区, 支持中文基础平台建设! LANGUAGE_CODE = \u0026#39;zh-hans\u0026#39; TIME_ZONE = \u0026#39;Asia/Shanghai\u0026#39; USE_I18N = True USE_L10N = True USE_TZ = False # 此处必须为False 在你的url.py中加入引用 from django.conf.urls import include from django.views.generic import RedirectView url.py的urlpatterns中加入路由 path(\u0026#39;echart/\u0026#39;, include(\u0026#39;smart_chart.echart.urls\u0026#39;)), path(\u0026#39;\u0026#39;, RedirectView.as_view(url=\u0026#39;echart/index/\u0026#39;)), #首页,可自定义路由 初始化DB, 命令行输入: python manage.py makemigrations python manage.py migrate 建立管理员帐号, 如果已有可忽略 python manage.py createsuperuser 启动服务 python manage.py runserver 10. 点击首页的组件升级进行初始化 :cupid: !!!! 重要！！！ 注意 # 一般来说如果你使用django遇到的问题，都不是smartchart导致的， 作者也很难给你解答， 建议你可以进行有偿问答\n"},{"id":13,"href":"/docs/%E5%85%B3%E4%BA%8E%E6%88%91%E4%BB%AC/","title":"关于我们","section":"Docs","content":" 我们的目标 # 打造全生态的数据应用数据管理的平台，解决中小企业上中台难,上中台贵,见效慢的问题. 平台与时俱进，不断完善与优化中 可以通过视屏了解我们的架构设计 企业数字化与smartchart的一站式解决方案\n我们不提供数据存储与计算引擎, ETL工具, BI工具. 因为已有更优秀的产品，我们只为数据开发人员提供更敏捷的工具与平台，致力于数据服务中台建设，边缘可视化与数据管道产品, 站在巨人的肩上, 让数据更有个性，更灵活与可定制化，由于他的通用性，功能的扩展变得也是非常的Smart\n产品定位 # 实现全生态的数据服务平台(数据收集, 数据加工, 数据分享，数据管理，数据应用)\n产品模块 # 统一的数据处理调度平台、数据管道, 是基于Apache顶级项目Airflow上的二次开发产品,让数据处理的任务调度开发与管理微代码化，我们的设计理念是让开发者更方便的同时，不丧失灵活和高度可自定义，如果你使用过smartchat，你可以想象他会带来的便捷性， 产品名为smartpip, 为啥不叫smartpipe, 因为能省我们就要省\u0026hellip; 统一的可视化管理平台, 为微信等第三方应用, 提供powerbi,tableau,finebi\u0026hellip;的嵌入式及功能扩展服务，数据集即服务，一切为数据集 统一的数据上传平台, 实现线下数据的收集需求, 并提供专业的手工上传数据产品, 支持excel本地(安装与免安装版本), 支持WEB端 统一的数据分享平台与smartchart集成，可做为数据服务中台, 实现业务对数据下载的需要及为第三方提供获取数据的API接口 SmartChart可视化平台, 新一代的数据可视化产品, 解决传统BI各种痛点问题,真正面向开发人员的平台产品 元数据管理平台及数据治理，让数据的来源更清晰, 让数据应用更方便，具备自动化，可视化的数据血缘分析 新一代极速数据仓库技术, 极简架构即可实现在大数据应用的全场景需求 "},{"id":14,"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/","title":"专业版本说明","section":"1.基础操作","content":" 版权声明 # 为项目能持续维护，并保持稳定的模式，按照社区投票的意见, 开始区分免费版本和专业版本 目前免费版本无需激活， 你可以使用到常用的功能，我们也会保持持续的更新 为保持项目的健康发展，如需进行商用，您需提供使用方并知会作者进行授权\n免费版使用者必须保留SmartChart相关版权标识及LOGO，禁止对其进行修改和删除 如果违反，将保留对侵权者追究责任的权利\n激活方式 # 您在初次安装Smartchart后会自动免费激活10天的专业版本, 之后专业版本功能会限制使用 请务必仔细阅读免费版本与专业版本的区别, 避免带来的不便 后续如果您还需要继续体验专业版本， 点击查看激活试用方式， 如果您是企业用途，建意使用专业版，获取更快的开发效率，可视化效果, 可靠性的保障及极速的查询体验\n针对个人独立开发者,你可以采用廉价的专业版仪表盘激活方案, 可满足小项目的可视化要求 如果需要永久激活专业版，可关注公众号与客服联系,或扫码联系微信客服了解, 非诚勿扰\n微信客服不提供技术咨询, 如有使用方法的疑惑,建意加QQ群:476715246 进行沟通\n免费版本与专业版本对比: # 功能 免费版 专业版 中台版 个人版 栅格布局 V V V V DATAV V V V V 拖拽布局 V V V 自由开发 V V V 切换图表主题 V V V 主题自由设计 V V V 引入JS V V V 引入CSS V V V 上传静态资源 V V V 使用VUE V V V V 数据集开发 V V V V 所有数据源 V V V V 图形开发 V V V V 图形商店 V V V V 普通模板应用 V V V V 专业模板应用 V V V 复制仪表盘 V V V V 钻取 V V V V 联动 V V V V 筛选 V V V V 单点登录 V V V V 嵌入认证 V V V LDAP认证 V V V Juypter V V V V 快捷存档 V V V 数据加速 V V V 数据API服务 V V V 后台API刷新 V V V 仪表盘同步 V V V 仪表盘版本管理 V V V 数据填报 V V V 报表Portal V V V 多级项目菜单 V 商业授权 V V 优先咨询 V V 专业边框背景 V V 3D场景 V V V 中国式报表 V V V 零代码数据集 V V V 生产部署文档 V V 个性化修改 V V 授权书 V V 低代码ETL V 调度平台 V 智慧BI V 数据资产 V 数据质量 V 数据血缘 V 租户管理 V "},{"id":15,"href":"/docs/1.%E5%9F%BA%E7%A1%80%E6%93%8D%E4%BD%9C/VUE%E7%9B%B8%E5%85%B3/ElementUI/","title":"Element Ui","section":"Vue相关","content":" 应用场景 # 非大屏场景应用 有较多交互场景的报表, 如筛选,表格,分页,下载等 使用方法 # 如下图, base.html 改为 basevue.html 将自动开启加载vue和elementui 注意vue的变量引用在 模板编辑界面中, 写法变更为 {[ ]}\nElementUI组件说明 视屏参考\n参考样列 # 新增一个数据集(点击金色的新增按钮, 这样会新增一个可拖拽的数据集) 修改相应的数据集及图形 数据集端\nselect H1, H2, qty, rate from smartdemo2 limit 100 图形端\nlet dataset = __dataset__; let tableData = ds_createMap_all(dataset); vapp.d0={ tableData: tableData } 模板Body区端\n\u0026lt;div class=\u0026#34;smtdrag\u0026#34; id=\u0026#34;id_1639824145817\u0026#34;\u0026gt; \u0026lt;template\u0026gt; \u0026lt;el-table stripe border height=\u0026#34;100%\u0026#34; :data=\u0026#34;d0.tableData\u0026#34; style=\u0026#34;width: 100%\u0026#34;\u0026gt; \u0026lt;el-table-column label=\u0026#34;hero\u0026#34;\u0026gt; \u0026lt;el-table-column prop=\u0026#34;H1\u0026#34; label=\u0026#34;H1\u0026#34; fixed :default-sort = \u0026#34;{prop: \u0026#39;H2\u0026#39;, order: \u0026#39;descending\u0026#39;}\u0026#34; width=\u0026#34;180\u0026#34;\u0026gt; \u0026lt;/el-table-column\u0026gt; \u0026lt;el-table-column prop=\u0026#34;H2\u0026#34; label=\u0026#34;H2\u0026#34; sortable width=\u0026#34;180\u0026#34;\u0026gt; \u0026lt;/el-table-column\u0026gt; \u0026lt;/el-table-column\u0026gt; \u0026lt;el-table-column sortable prop=\u0026#34;qty\u0026#34; label=\u0026#34;qty\u0026#34;\u0026gt; \u0026lt;/el-table-column\u0026gt; \u0026lt;el-table-column prop=\u0026#34;rate\u0026#34; label=\u0026#34;rate\u0026#34;\u0026gt; \u0026lt;/el-table-column\u0026gt; \u0026lt;/el-table\u0026gt; \u0026lt;/template\u0026gt; \u0026lt;/div\u0026gt; "},{"id":16,"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/","title":"复制仪表盘","section":"不太重要","content":" 复制仪表盘 # 好不容易开发好了一个仪表盘, 想再做一个类似的, 或者想要一个测试用, 还需要一个个数据集, 图形复制粘贴么, 不, 你仅仅只需要点击下, 将给你复制出一个全新的仪表盘 注意: 复制出来的仪表盘, 数据集是与原仪表盘公用的！！\n如果你想将数据集独立出来, 可以按下图操作, 进入数据集设定, 点击磁铁, 将为你自动创建一个全新的数据集 "},{"id":17,"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/","title":"Sql数据集","section":"2.数据集说明","content":" 前言 # 使用最广泛的数据集一般都是SQL数据集 SmartChart标准数据集你可以想象为一个EXCEL的二维表, 有行和列 你直接在数据集开发界面填写SQL即可 更多数据集说明查看\u0026quot;特殊数据源\u0026quot; 动态传参数据集查看\u0026quot;参数及联动\u0026quot;章节 标准图形的数据表类型 # A类数据源 # # 比如你的原始数据库中表的格式如下, 表名tb_name: 城市 户型 数量 长沙 A 12 长沙 A 23 上海 B 19 # 查询的sql: select 城市,户型,sum(数量) AS 数量 from tb_name group by 城市,户型 # 正常的查询的结果为: [[\u0026#39;城市\u0026#39;,\u0026#39;户型\u0026#39;,\u0026#39;数量\u0026#39;], [\u0026#39;长沙\u0026#39;,\u0026#39;A\u0026#39;,35], [\u0026#39;上海\u0026#39;,\u0026#39;B \u0026#39;,19]] # 由于生成的数据格式第二行是 [字符,字符,数值], 后台会自动进行转列动作, # 生成图表更容易使用格式: [[\u0026#39;Categroy\u0026#39;,\u0026#39;A\u0026#39;,\u0026#39;B\u0026#39;], [\u0026#39;长沙\u0026#39;, 35, 0], [\u0026#39;上海\u0026#39;, 0, 19]] B类数据源 # # 再比如我们有一个表的数据格式, 指标是展开的: 城市 A B 长沙 10 12 上海 11 19 长沙 9 10 # 我们可以写的sql是: select 城市, sum(A) as A, sum(B) as B from tb_name group by 城市 # 这样得到的结果是: [[\u0026#39;城市\u0026#39;,\u0026#39;A\u0026#39;,\u0026#39;B\u0026#39;], [\u0026#39;长沙\u0026#39;, 19, 22], [\u0026#39;上海\u0026#39;, 11, 19]] 这样和我们的标准格式也是一样的 SQL多段查询 # 有时你一个数据集可能只用一个SQL查询还不够，比如你需要一个清单数据，同时你需要一个汇总数据做为说明在图形中显示，这样你就需要使用多条SQL语句，在数据集中的写法你只需要用分号隔开，如：\n//数据集中的查询 select ... from xxx; select ..... from xxxxxxx // 传递到图形中的格式为: {\u0026#34;df0\u0026#34;:[[...]]. \u0026#34;df1\u0026#34;:[[......]]} df0, df1分别对应的是第一段和第二段查询 多段查询使用视屏参考\n"},{"id":18,"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/","title":"Python数据集","section":"特殊数据源","content":" 应用场景 # 当SQL查询无法满足你的需求, 你需要对查询后的结果进行处理, 或者你需要使用Excel的数据源, 甚至你需要对不同系统的数据进行查询, Python连接器可以帮到你 我们又称他为万能数据集， 你可以使用任何python语法， 需要把数据集的结果赋值给ds变量!!\n首先你需要新建python连接器, 由于安全控制只允许超级管理员建立 # 内置函数说明 ds_get(id) #输入目标数据集的id名, 可以获取目标数据集 ds_df(id) #输入目标数据集的id名, 转化成pandas的df对象 ds_sql(conn_name, sql_str) #输入连接池中的名称, SQL语句, 获取数据集 ds_list(df) #将pandas的df对象转化成数据集 使用方法样列说明 # 读取Excel数据处理, 如需上传页面可参考\u0026quot;数据上传\u0026quot;说明\nimport pandas as pd df = pd.read_excel(\u0026#39;文件路径\u0026#39;, \u0026#39;表名\u0026#39;) df = df.groupby(\u0026#39;c3\u0026#39;).agg({\u0026#39;qty\u0026#39;:\u0026#39;sum\u0026#39;}).reset_index() ds = ds_list(df) 从数据集获取数据后进行处理\nds=ds_get(12) ds=ds[:15] 从数据集获取数据转化成pandas对象处理\ndf = ds_df(12) df = df.sort_values(by=\u0026#34;出场数\u0026#34;, ascending=False) ds = ds_list(df) 生成字典格式的数据集供多个图形使用\nimport pandas as pd df = pd.read_excel(\u0026#39;/Users/../smartdemo.xlsx\u0026#39;, \u0026#39;demo\u0026#39;) df0 = df.groupby(\u0026#39;c3\u0026#39;).agg({\u0026#39;qty\u0026#39;:\u0026#39;sum\u0026#39;}).reset_index() df1 = df.groupby([\u0026#39;province\u0026#39;,\u0026#39;c3\u0026#39;]).agg({\u0026#39;qty\u0026#39;:\u0026#39;sum\u0026#39;}).reset_index() ds = {\u0026#39;df0\u0026#39;: ds_list(df0), \u0026#39;df1\u0026#39;: ds_list(df1)} 直接执行SQL,可用于跨数据源处理\nsql_str = \u0026#39;\u0026#39;\u0026#39;select H1 as heroname, sum(qty) as 出场数 from T /* where H2 = \u0026#39;$H2\u0026#39; */ group by H1 order by sum(qty) desc\u0026#39;\u0026#39;\u0026#39; ds = ds_sql(\u0026#39;连接名称\u0026#39;, sql_str) ds = ds[:10] "},{"id":19,"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/","title":"Jquery遍历方法","section":"函数方法","content":"在做自定义html组件的时候你可能需要用得上：\n一、向上遍历\nparent() 获取元素的直接父元素 $(\u0026#34;span\u0026#34;).parent().css({ \u0026#34;color\u0026#34;:\u0026#34;red\u0026#34;, \u0026#34;border\u0026#34;:\u0026#34;1px solid red\u0026#34; }) parents() 获取元素的祖先元素，直到根元素html $(\u0026#34;span\u0026#34;).parents().css({ \u0026#34;color\u0026#34;:\u0026#34;red\u0026#34;, \u0026#34;border\u0026#34;:\u0026#34;1px solid red\u0026#34; }) parentsUntil() 向上查找直到遇见某个祖先元素为止 $(\u0026#34;span\u0026#34;).parentsUntil(\u0026#34;div\u0026#34;).css({\t//向上查找直到遇见div元素为止 \u0026#34;color\u0026#34;:\u0026#34;red\u0026#34;, \u0026#34;border\u0026#34;:\u0026#34;1px solid red\u0026#34; }) 二、向下遍历\n1. children() 查找子元素[按照从属关系] $(\u0026#34;ul\u0026#34;).children(\u0026#34;li:first-child\u0026#34;) 2. find() 按照指定的条件向下查找 $(\u0026#34;ul\u0026#34;).find(\u0026#34;span\u0026#34;) 三、水平遍历\n1. siblings() 获取元素的所有兄弟元素 $(\u0026#34;.start\u0026#34;).siblings().css({color:\u0026#34;red\u0026#34;,border:\u0026#34;2px solid red\u0026#34;}) 2. next() 获取元素的下一个兄弟元素 $(\u0026#34;.start\u0026#34;).next().css({color:\u0026#34;red\u0026#34;,border:\u0026#34;2px solid red\u0026#34;}) 3. nextAll() 获取其后的所有兄弟元素 $(\u0026#34;.start\u0026#34;).nextAll().css({color:\u0026#34;red\u0026#34;,border:\u0026#34;2px solid red\u0026#34;}) 4. nextUntil() 查找后面所有的兄弟元素，直到遇见某个元素为止 $(\u0026#34;.start\u0026#34;).nextUntil(\u0026#34;li:last-child\u0026#34;).css({color:\u0026#34;red\u0026#34;,border:\u0026#34;2px solid red\u0026#34;}) 5. prev() 查找上一个兄弟元素 $(\u0026#34;li.start\u0026#34;).prev().css({color:\u0026#34;red\u0026#34;,border:\u0026#34;2px solid red\u0026#34;}) 6. prevAll() 查找上面所有的兄弟元素 $(\u0026#34;li.start\u0026#34;).prevAll().css({color:\u0026#34;red\u0026#34;,border:\u0026#34;2px solid red\u0026#34;}) prevUntil() 查找上面所有的兄弟元素，直到遇见某个元素为止 $(\u0026#34;.start\u0026#34;).prevUntil(\u0026#34;li:first\u0026#34;).css({\u0026#34;color\u0026#34;:\u0026#34;red\u0026#34;,\u0026#34;border\u0026#34;:\u0026#34;2px solid red\u0026#34;}) 四、过滤\n1. first() 获取第一个元素 $(\u0026#34;li\u0026#34;).first().css(\u0026#34;color\u0026#34;,\u0026#34;red\u0026#34;); 2. last() 获取最后一个元素 $(\u0026#34;li\u0026#34;).last().css(\u0026#34;color\u0026#34;,\u0026#34;red\u0026#34;); 3. not() 获取不是…的元素 $(\u0026#34;li\u0026#34;).not(\u0026#34;:eq(2)\u0026#34;).css(\u0026#34;font-size\u0026#34;,\u0026#34;26px\u0026#34;); 4. eq(n) 获取索引为n的元素 $(\u0026#34;li\u0026#34;).eq(3).css(\u0026#34;background\u0026#34;,\u0026#34;green\u0026#34;); 5. has() 检测某个子元素是否存在 $(\u0026#34;li\u0026#34;).eq(1).has(\u0026#34;span\u0026#34;).length) 6. filter() 筛选出与符合条件的DOM元素 $(\u0026#34;div\u0026#34;)..filter(\u0026#34;.middle\u0026#34;) 7. is() 用来判断是否符合条件 $(\u0026#34;p\u0026#34;).parent().is(\u0026#34;div\u0026#34;)\t//判断p的父元素是不是div,是就返回true,不是就返回false 五、each遍历\n1. each() 方法为每个匹配元素规定要运行的函数。 $(selector).each(function(index,element){ ..... }) //index 表示当前遍历元素的索引 element 当前的元素（也可使用 \u0026#34;this\u0026#34; 选择器） 2. $.each(obj,function( index,value){}) "},{"id":20,"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/","title":"管理图形","section":"3.图形开发","content":" 应用场景 # 可以快速复用已开发好的图形组件\n本地管理自定义组件 # 如下图,点击图形编辑器中的菜单,即可管理和查看自定义图形列表 点击\u0026quot;加入样列\u0026quot;即可把当前图形加入到样列清单, 点击\u0026quot;取消样列\u0026quot;即可将所选样列移除样列清单 云管理,在图形商店中保存你的图形 # 这样你就可以在图形商店看到你的图形进行重复利用 "},{"id":21,"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/","title":"拖拽自动对齐","section":"4.布局说明","content":"拖拽很方便, 但是精确对齐还是有些手抖, 所以smartchart增加了自动对齐的功能 你可以在\u0026quot;模板\u0026quot; \u0026ndash;\u0026gt; \u0026ldquo;转化\u0026rdquo; 中找到这个功能 首先我们随意拖拽了一些组件 然后选中拖拽代码段, 点\u0026quot;拖拽对齐\u0026quot; 后 点\u0026quot;保存\u0026quot; 就可以查看对齐后的效果了, 再进行下拖拽微调, 重复以上动作到满意 "},{"id":22,"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/","title":"图形联动钻取","section":"5.参数及联动钻取","content":" 数据集准备 # 首先在需要进行联动的数据集中SQL的写法如下, 比如对应2号图形:\n注意 /* ... */的写法, 当参数写在这个区间时, 如果外部没有传入参数, 会自动忽略这一段代码, 这样对于联动来说非常重要, 初始时全部显示, 点击其它图形时传入参数进行动态联动 select xxx,xxx,xxx from tablename /* where xxxx = \u0026#39;$参数名\u0026#39; */ .... 建意观看视屏比较容易理解: 数据联动说明\n常规方法 # 比如你需要点击0号图形, 指定其它图形联动 你只需要打开0号图形的数据集编辑页面, 点击标题的位置 然后输入相关的参数即可, 以下为sample 参数值设定的方法, 你可以先留空, 然后保存, F12打开浏览器调试方法 点击0号图形你需要点击的动作, 你可以在调试窗口的console看到输入的log 比如我们需要传递的参数值是\u0026quot;廉颇\u0026quot;, 那么取数据的方法就是data.name, 你把这个填入即可 这样就实现按所选数据或所选系列钻取/联动了, 重新点击当前所选, 恢复原来的\nTIPS: 在图形编辑器中, 可以使用函数 ds_param(\u0026lsquo;参数名\u0026rsquo;) 来获取传入的参数值\n高级定制方法 # 如有更多个性化需求,可在需要点击的图形的编辑器中加入以下代码,仅需修改的是序号和参数名\n//比如传入多个参数进行联动 myChart__name__.on(\u0026#39;click\u0026#39;, function(params){ let myparam = params.seriesName; //获取点击的值 ds_setParam(\u0026#39;参数名\u0026#39;, myparam); //填写你的数据集的SQL设定中对应的参数名 ds_setParam(\u0026#39;参数名2\u0026#39;, myparam2); //你可以赋值给多个参数 ds_refresh(3); //3 为你要刷新图形序号 }); //函数方法说明 ds_setParam(\u0026#39;参数名\u0026#39;, 参数值) 此方法将自动判断当参数值为空时, 删除参数回到初始未传参状态 你还可以实现钻取到另外一个报表\nmyChart__name__.on(\u0026#39;click\u0026#39;, function (params) { let myparam = `\u0026amp;param={\u0026#34;参数名\u0026#34;: \u0026#34;${params.seriesName}\u0026#34;}`; //拼成url并传参，具体参考数据集说明中的数据联动url传参的方法 let myurl=\u0026#39;http://localhost:8000/echart/?type=目标报表名\u0026#39;+ myparam; window.open(myurl,\u0026#39;_blank\u0026#39;,\u0026#39;toolbar=no,scrollbar=no,top=100,left=100,width=800,height=500\u0026#39;); }); TIPS 如果你的参数中存在非法字符如\u0026amp;=, 你可以使用encodeURIComponent函数进行转义后赋值\n"},{"id":23,"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/","title":"快捷开发","section":"低代码开发","content":" 应用场景 # 专业化开发, 可将仪表盘显示和模板开发分屏开发 当你熟悉smartchart的基础开发后, 你可能会喜欢上现在这种方式 把你的可视化页面移动的显示器上吧, 进入\u0026quot;模板\u0026quot; 开发页面(上节介绍如何进入)\n方式一: 自动化DIV # 此方式当你新增数据集图形时会自动识别, 无需手动在模板在添加 采用此方式请不要采用点击模板上方菜单的图形新增 如需编辑图形或数据集可按如下方式: 方式二: 自由DIV # 你可以模板中按照常规的H5页面编辑, 只是在需要插入图形的地方插入即可(建意通过模板上方的图形新增) 开始畅快的开发\n点击图形即可新增一个图形,你甚至可以指定图表的位置, 完全和写html一样, 图形代码段:{{div_list.图表顺序号}} 注意自由DIV模式下的新增图形, 是不自带容器的, 如有需要,可选中\u0026quot;图形代码\u0026quot;,点击菜单的容器包裹上容器 如果使用自由布局, 请删除自动化DIV这一段代码 选中生成的图形代码段, 点击菜单栏的 数据集, 图形, 布局开发或使用CTRL+Q， 即可进入开发界面, 如果没有数据集, 会自动帮你新建 可以观看视屏, 视屏比较老和现在不太一样, 仅参考即可 自由开发模式视屏\n"},{"id":24,"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/","title":"数据服务 API","section":"数据服务","content":" SmartChart的数据集功能, 可以非常方便的实现数据对外微服务 # 权限设定 # 帐号访问权限 # 超级管理员可以在首页右上角用户图标的菜单中, 找到\u0026quot;服务配置\u0026quot;打开 比如需要调用API的用户名为test 和 test2，用户名需要是在你的用户设定中存在的,内容如下: { \u0026#34;test\u0026#34;: { \u0026#34;token\u0026#34;: \u0026#34;smartchart\u0026#34; }, \u0026#34;test2\u0026#34;: { \u0026#34;token\u0026#34;: \u0026#34;smartchartxxx\u0026#34;, \u0026#34;host\u0026#34;: [\u0026#34;10.10.10.10\u0026#34;,\u0026#34;10.10.10.23\u0026#34;], \u0026#34;limit\u0026#34;: 60, \u0026#34;log\u0026#34;:1, \u0026#34;cors\u0026#34;: 1 } } 可选设定参考test2 host:API白名单配置，limit:一分钟内可调用次数, log:日志记录方式. cors:永许跨域访问\n数据集权限 # 在数据集权限管理中, 将你需要开放的数据集的权限, 设定给对应的用户 请求方式 # 加密接口请求方式（推荐） # 下文提到的\u0026quot;秘钥\u0026quot;即上文设定中的\u0026quot;token\u0026quot;, 注意上文的token非下文提到的token\nGET 请求 # #接口请求格式: url= \u0026#39;/echart/dataset_api/?visitor=xxx\u0026amp;token=xxx\u0026amp;type=xxx\u0026amp;stamp=xxxxx\u0026amp;param={\u0026#34;xx\u0026#34;:\u0026#34;xxx\u0026#34;,\u0026#34;xx\u0026#34;:\u0026#34;xxxx\u0026#34;}\u0026#39; # 参数说明 visitor: 用户名 type: 接口数据集ID stamp: 时间戳(1970年1月1日到生成时间的毫秒数) token: 采用sha1加密, token=SHA1(秘钥 + stamp + visitor + type) param: 数据集查询参数清单(可选), 格式json字符串, 如: \u0026#39;{\u0026#34;参数A\u0026#34;:\u0026#34;xxxx\u0026#34;, \u0026#34;参数B\u0026#34;:\u0026#34;xxxx\u0026#34;}\u0026#39; # 接口返回格式Json: { \u0026#34;data\u0026#34;:[[]], \u0026#34;result\u0026#34;:\u0026#34;success\u0026#34;, \u0026#34;maxpg\u0026#34;:1, \u0026#34;pg\u0026#34;:1 } # 返回值说明: data : 二维数组, 第一行为表头, 样列数据如下 [[\u0026#34;heroname\u0026#34;, \u0026#34;qty\u0026#34;],[\u0026#34;镜\u0026#34;,658],[\u0026#34;猪八戒\u0026#34;,591]] result : success 或 error maxpg/pg : GET请求固定为1不分页 POST请求(适用于后台定时同步数据，查询请用GET请求方法) # #接口请求格式: url: /echart/dataset_api/ # 请求参数data: { \u0026#34;visitor\u0026#34;:\u0026#34;xxx\u0026#34;, \u0026#34;token\u0026#34;:\u0026#34;xxx\u0026#34;, \u0026#34;stamp\u0026#34;:xxxxx, \u0026#34;type\u0026#34;:\u0026#34;xxx\u0026#34;, \u0026#34;pagesize\u0026#34;:\u0026#34;xxx\u0026#34;, \u0026#34;pg\u0026#34;:\u0026#34;xxx\u0026#34;, \u0026#34;param\u0026#34;:\u0026#39;{\u0026#34;xxx\u0026#34;:\u0026#34;xxxx\u0026#34;}\u0026#39; } # data参数说明 visitor: 用户名 type: 接口数据集ID stamp: 时间戳(1970年1月1日到生成时间的毫秒数) token: 采用sha1加密, token=SHA1(秘钥 + stamp + visitor + type) Pagesize: 采用分页, 每页的数据量大小 pg: 返回第几页 param: 数据集查询参数清单(可单), 拼接成json字符串, 如: \u0026#39;{\u0026#34;参数A\u0026#34;:\u0026#34;xxxx\u0026#34;, \u0026#34;参数B\u0026#34;:\u0026#34;xxxx\u0026#34;}\u0026#39; #接口返回格式Json: { \u0026#34;data\u0026#34;:[[]], \u0026#34;result\u0026#34;:\u0026#34;success\u0026#34;, \u0026#34;maxpg\u0026#34;:xxx, #最大页数 \u0026#34;pg\u0026#34;:xx, #当前页数 \u0026#34;casheflag\u0026#34;: xx, #如果是999说明命中缓存 \u0026#34;total\u0026#34;:xx, #总条数 } 注意： 只有post是分页的, 第一页是带标题的， 后面页不带标题 由于post方式会使用缓存进行分页,如命中缓存传参不会生效，小数据量请使用get方式请求 不要请求大数据量，大量数据请采用limit, offset传参方式进行分页\n不加密请求方式(简单但不安全） # GET 请求 #接口请求格式: url= \u0026#39;/echart/dataset_api/?visitor=xxx\u0026amp;token=xxx\u0026amp;type=数据集名或id\u0026#39; #接口返回格式Json: { \u0026#34;data\u0026#34;:[[]], \u0026#34;result\u0026#34;:\u0026#34;success\u0026#34;, \u0026#34;maxpg\u0026#34;:1, \u0026#34;pg\u0026#34;:1 } POST请求 #接口请求格式: url: /echart/dataset_api/ data: { \u0026#34;visitor\u0026#34;:\u0026#34;xxx\u0026#34;, \u0026#34;token\u0026#34;:\u0026#34;xxx\u0026#34;, \u0026#34;type\u0026#34;:\u0026#34;xxx\u0026#34;, #数据集名或id名 \u0026#34;pagesize\u0026#34;:\u0026#34;xxx\u0026#34;, #每页数据条数 \u0026#34;pg\u0026#34;:\u0026#34;xxx\u0026#34;, #返回第几页 \u0026#34;param\u0026#34;:\u0026#39;{\u0026#34;xxx\u0026#34;:\u0026#34;xxxx\u0026#34;}\u0026#39; #参数可选 } #接口返回格式Json: { \u0026#34;data\u0026#34;:[[]], \u0026#34;result\u0026#34;:\u0026#34;success\u0026#34;, \u0026#34;maxpg\u0026#34;:xxx, #最大页数 \u0026#34;pg\u0026#34;:xx, #当前页数 \u0026#34;casheflag\u0026#34;: xx, #如果是999说明命中缓存 \u0026#34;total\u0026#34;:xx, #总条数 } 注意: 只有post是分页的, 第一页是带标题的, 后面页不带标题 由于post方式会使用缓存, 小数据量建议你使用get方式请求 "},{"id":25,"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/","title":"单点登录","section":"7.报表嵌入","content":" 单点登录的方式与smartchart进行对接嵌入 # \u0026#39;/echart/smart_login?id=xxx\u0026amp;stamp=xxx\u0026amp;token=xxx\u0026amp;url=/\u0026#39; \u0026#39;\u0026#39;\u0026#39; 参数说明： id: 用户名（在smartchart平台中管理） stamp: 时间戳(1970年1月1日到生成时间的毫秒数) token: 采用sha1加密, token=SHA1(链接秘钥+stamp+id) 请在安装smartchart的这台机器上设定环境变量SMART_KEY = 链接秘钥 url: 登录成功后跳转链接 \u0026#39;\u0026#39;\u0026#39; Python后台样列: # import time import hashlib import os \u0026#34;\u0026#34;\u0026#34; 参数说明： id: 用户名（在smartchart平台中管理） stamp: 时间戳(1970年1月1日到生成时间的毫秒数) token: 采用sha1加密, token=SHA1(链接秘钥+stamp+id) url: 登录成功后跳转链接 \u0026#34;\u0026#34;\u0026#34; SMART_CHART_URL = \u0026#39;http://127.0.0.1:8000\u0026#39; LOGIN_URL = SMART_CHART_URL + \u0026#39;/echart/smart_login?id={id}\u0026amp;stamp={stamp}\u0026amp;token={token}\u0026amp;url={url}\u0026#39; SMART_KEY = 链接秘钥 def get_smarturl(username, url=\u0026#39;/\u0026#39;): stamp = int(time.time() * 1000) id = username res = SMART_KEY + str(stamp) + id token = hashlib.sha1(res.encode(\u0026#39;utf-8\u0026#39;)).hexdigest() LOGIN_DICT = { \u0026#34;id\u0026#34;: id, \u0026#34;stamp\u0026#34;: stamp, \u0026#34;token\u0026#34;: token, \u0026#34;url\u0026#34;: url } # 拼接好的url,直接访问 visit_url = LOGIN_URL.format(**LOGIN_DICT) return visit_url "},{"id":26,"href":"/docs/8.Django%E5%BA%94%E7%94%A8/FAQ/","title":"Faq","section":"8. Django应用","content":" FAQ # 如果你想对smartchart前端二次开发或关闭debug模式后找不到资源 在settings中加入\nSTATIC_ROOT = os.path.join(BASE_DIR, \u0026#34;static\u0026#34;) 执行以下命令将静态文件静态文件克隆到根目录\npython3 manage.py collectstatic "},{"id":27,"href":"/docs/%E8%AE%BE%E8%AE%A1%E7%90%86%E5%BF%B5/","title":"设计理念","section":"Docs","content":"Smartchart6.0 已发布, 带来全新的功能与体验\n设计哲学: # 她是基于真实应用场景的敏捷数据中台而设计的产品,已成熟在多个大型企业应用多年,不仅是一个可视化低代码开发平台, 也是数据接口低代码, 甚至是业务系统低代码开发平台 支持多种混合布局, 对于普通报表可以使用响应式布局同时满足大屏, 电脑, 平板, 手机端的页面, 对于大屏也可使用拖拽辅助布局来配合自由开发模式(专业版) 她是面向开发者, 如果需要设计出来非常漂亮有个性的数据展现形式, 我们发现如果要达到这个目的, 不管用什么开发工具, 最终还是需要用户了解一些基础的html, css, echarts的配置, 如果去学习某个平台中要在那些地方点点点的界面上进行配置, 那么为什么不去学习使用原生的呢, 这样反而更简单, 用户可以找到的参考资源更全面, 甚至可以从社区的代码中直接复制过来, 所以我们设计理念是不自定义开发语言, 而是帮大家建立数据与图形的高速公路, 定义交通规则 和提供服务区 smartchart有很多隐藏功能, 所以初入smartchart的同学会一脸迷惑, 无从下手, 因为我们讲究 精减设计 和 可扩展性 , 如果有些功能只用一次, 就不会让他在界面显示, 我们不推荐不看文档和视屏就直接上手开发的模式, 给你门槛是为了将来使用得不会太累 她重在数据处理的便捷, 联动/刷新机制设计一气呵成, 无缝的原生图形开发工具, 没有拖泥带水的让用户去找设定开关, 你甚至可以使用你喜欢的IDE进行开发, 给开发者充分发挥的自由 smartchart是一个企业级解决方案, 不是一个玩具, 她不喜欢浮躁, 需要你沉下心, 慢慢体验, 属于慢热型, 就好比是做菜, smartchart是给你提供了已经切好的菜和菜谱说明, 你可以按自已喜欢加火放调料就行, 你甚至可以增加新的调料(如css, js引用) 或更换调料. 相比有些产品就是给你准备的是已做好的菜品, 如果你觉得它盐放得太多, 你得清洗下, 再重新回锅, 对于我们开发人员来说, 这是不可忍受的 类似于养成类游戏, 你可以在开发过程中积累图形, 模板等等, 在后面的项目中可以直接用复制粘贴的方式进行复用, 而不需要再界面上重新进行配置调整. 你也可以和其它开发者(厨师)交流, 互通有无, 快速提升自已的等级, 比如购买模板就是最快的方法 与传统BI的区别 # 传统BI面向非技术人员, 更注重于开发的过程无代码化,所以最终实现的可视化效果较差, 可定制化程度低, 访问速度慢,对硬件要求高, 应用场景局限性比较大 smartchart是面向技术人员的可视化产品, 更注重于最终效果, 采用的是低代码技术, 对技术人员更友好, 可定制化高, 可视化效果更好, 访问速度快, 更灵活,对硬件要求低, 应用范围广 与开源大屏设计器区别 # 大屏设计器只关注内置的一些边框, 图形效果等前端效果, 不注重于数据的开发, 华而不实 smartchart是真正意思上的全场景解决方案, 从数据开发, 可视化, 到版本上线管理, 嵌入等工程化场景全覆盖 "},{"id":28,"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/","title":"快速开始","section":"1.基础操作","content":" 开发前视屏 # 6.0介绍视屏 4.0操作视屏教程 5.0变更操作视屏教程 开发系列合集,关注作者持续更新 由于版本的变更, 一些图标可能会有一些变化, 但位置无太大的变化\n安装Python环境 # 环境准备: 官方 最新Python下载链接,可以到 淘宝镜象下载,也可以下载 WINDOWS64位安装版, MAC电脑安装版 Window平台安装视屏介绍,注意: Windows安装Python时需选中\u0026quot;Add to Path\u0026quot; Linux安装可参考文档下方的部署说明, Linux安装说明 安装SmartChart # 在Shell或CMD命令行执行\npip3 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, 请及时更改密码\n如果忘记密码, 可以使用此命令重置 smartchart changepassword 用户名 查看demo # 尝试熟悉编辑菜单 尝试点开数据集查看SQL写法， 图形编辑器， 容器等 仪表盘菜单 # 功能项 子项 使用说明 菜单栏 - 点击可展开隐藏, 可移动位置 设定 常规设定 权限管理,水印,模板应用,版本控制.. 设定 高级设定 开启模板/移动端适应/VUE/DATAV/场景背景.. 设定 批量布局 批量修改容器的HTML, 不常用 设定 容器管理 批量查看/管理/删除容器, 不常用 模板 - 进入低代码开发,引入JS/CSS,上传,组件\u0026hellip; 新增 拖拽图形 新增一个带拖拽容器的图形组件 新增 栅格图形 新增一个带栅格容器的图形组件 新增 上线数据集 新增一个已开发好的数据集(需要是上线状态) 新增 懒加载数据集 新增后在菜单栏可查看编辑,此数据集需自定义触发查询,默认可引用全局变量名为data序号, 如data0 新增 通用数据集 新增后在菜单栏可查看编辑,主动触发查询,全局变量名为data序号, 如data0 新增 静态组件 新增一个不带数据集及图形的html组件, 如图片,文字描述\u0026hellip; 新增 复杂报表 使用类excel的方式开发报表 拖拽开关 - 切换拖拽锁定, 如需编辑EXCEL图形组件, 一般需要锁定 弹窗方式 - 切换编辑器是嵌入方式还是新开页面 自定义主题 - 修改echarts的主题, 仅当前仪表盘有效 调试 - 切换是否显示调试打印的日志,如打开后可以进行精确拖拽定位 主题选择 - 切换显示内置echarts主题 预览 - 切换开发模式下的预览模式 数据集 - 菜单栏会显示未激活/通用/懒加载数据集 仪表盘容器菜单 # 功能项 子项 使用说明 序号 - 唯一标识容器ID,可以通过 #container_序号 来选择容器, 如样式选择:#container_0{}, JS选择:$(\u0026rsquo;#container_0\u0026rsquo;).xx 数据集开发 - 打开数据集开发界面, 可切换数据源,数据定时刷新,数据开发\u0026hellip; 图形开发 - 打开图形开发界面, 可进行实时图形配置调试, 切换内置图形, 自定义图形, 图形商店\u0026hellip; 容器开发 - 打开容器开发界面, 进行栅格布局调整, 拖拽方式不常用\u0026hellip; 隐藏容器 - 将容器切换为未激活状态,如果永久删除\u0026hellip; 高级设定 # 功能项 子项 使用说明 模板开关 - 开启模板开发, 新增拖拽图形后会自动开启 移动适配开关 - 不固定宽高比例模式, 如果非大屏建意开启 VUE - 开启后可以使用VUE模式开发 DATAV - 开启后可以使用DATAV的组件及VUE 极简菜单 - 开启后隐藏仪表盘中不常用工具图标 数据集模式 - 开启后仅用于查看和管理数据集 背景模板 - 可选择预设的大屏背景 数据集开发 # 功能项 子项 使用说明 标题 修改名称 修改数据集名称 标题 联动设定 图形联动相关的配置 标题 权限设定 数据集权限管理 主题 - 全局变更编辑器主题 数据源 - 点击显示默认数据库的表清单 数据源 切换数据源 切换数据源 数据源 编辑数据源 编辑当前数据源配置 数据源 新增数据源 新增数据源 数据源 刷新设定 设定数据集的后台缓存及前端刷新间隔时间 数据源 数据库清单 获取当前数据源所有的数据库清单 数据源 表清单 不选择数据库时, 获取默认数据库表清单, 选中数据库名称,可获取选中数据库表清单 数据源 表结构 选中表名,可获取表的字段描述 数据源 建表语句 选中表名,可获取表的建表语句 数据源 表样列 选中表名,可获取表的样列数据 数据源 表条数 选中表名,可获取表的总条数, 也可选中一段查询获取总条数 执行 - 执行预览数据集,或选中一段脚本执行 保存数据集 - 保存并刷新数据集后台缓存 图形开发 # 功能项 子项 使用说明 实时调试 - 默认开启, 修改配置后, 实时显示图形, 当大量数据处理时, 建意关闭 调色板 - 可进行颜色选择, 需复制颜色代码到配置项 图形 基础图形 系统内置基础图形, 如柱/线/点/饼/中国式报表\u0026hellip;, 可通过配制衍生出各种图形.. 图形 个人图形 可以保存个人修改或转化过的图形进行复用 图形 图形商店 参考smartchart官方样列图形, 复制粘贴即可使用 图形 Echarts社区 参考echarts官方样列图形, 复制粘贴后转化即可使用 参考 - 常用的echarts配置项菜单, 复制粘贴即可使用 工具 转化 将echarts原生图形转化为smartchart 工具 代码 代码折叠/展开等 模板开发 # 功能项 子项 使用说明 图形 - 适用于在将静态模板转化过程中或复杂布局场景使用, 常规建意采用在仪表盘界面中新增 容器 拖拽 选中组件代码段, 将为组件加上拖拽容器代码 容器 栅格 选中组件代码段, 将为组件加上栅格容器代码 容器 DATAV边框 选中组件代码段, 将为组件加上DATAV边框容器代码 编辑 数据集 选中带图形的代码段div_list.xx, 打开数据集编辑, 可用快捷键CTRL+Q 编辑 图形 选中带图形的代码段, 打开图形编辑 编辑 容器 选中带图形的代码段, 打开容器编辑 样式 - 常样html组件样式, 如背景颜色, 字体.. 组件 - 常用html组件, 如图片, 按钮, 轮播.. UI组件 - 常用elementUI组件, 使用方法需参考文档 3D模型 - 加载并使用3D模型场景 资源 - 不太常用的资源, 如加载词云, 地图\u0026hellip; 工具 - 代码折叠,对齐转化,快照定存,文件上传,数据集批量授权.. "},{"id":29,"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/","title":"Data V应用","section":"Vue相关","content":"需要在高级中可开启datav模式\n参考视屏 1. DataV基础应用 2. DataV翻盘器\nDataV配置方法文档: 图表\n"},{"id":30,"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/","title":"共享数据集","section":"数据集形态","content":" 应用场景 # 优化查询, 可一个数据集查询完所有数据进行分发 减少重复查询的浪费, 同一个数据只查询一次 使用方法 # 在仪表盘开发界面, \u0026ldquo;新增\u0026rdquo; \u0026ndash;\u0026gt; \u0026ldquo;共享数据\u0026rdquo; 在\u0026quot;设定\u0026quot; \u0026ndash;\u0026gt; ”高级“ \u0026ndash;\u0026gt;\u0026ldquo;高级设定\u0026rdquo; 中配置 这样3，4号图形都映射到了共享数据集(2号)的数据 当然你也可以任意JS中使用\u0026quot;data序号\u0026quot;这个全局变量, 如上就是data2\n你也可以在数据集中写多个SQL查询 -- 英雄1 select H1, count(1) as qty1 from smartdemo2 group by H1 limit 10; -- 英雄2 select H2, count(1) as qty2 from smartdemo2 group by H2 limit 10 然后在\u0026quot;设定\u0026quot; \u0026ndash;\u0026gt; ”高级“ \u0026ndash;\u0026gt;\u0026ldquo;高级设定\u0026rdquo; 中配置进行数据映射 "},{"id":31,"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/","title":"数据集数据刷新","section":"2.数据集说明","content":" 数据刷新设定方法 # smartchart提供非常精细的数据刷新功能,及内存加速功能 你可以在数据集开发界面的菜单中，连接图标\u0026ndash;\u0026gt;刷新设定，进行设定 定时刷新 # 你可以设定前端页面数据集向后端请求刷新的时间间隔，单位秒\n如果你发现定时刷新，数据并没有变化，可能原因是您数据的缓存时间设定大于定时刷新的时间\n数据集缓存加速（PRO) # smartchart专业版提供内存加速技术，对数据库仅需请求一次，之后都是毫秒级响应\n间隔时间刷新,单位分钟,如设定间隔时间为0.5, 则如果下一次访问时间超过30秒, 即触发数据刷新 固定时点刷新, 如设定间隔时间为-1, 则固定时点刷新, 即访问的时间超过固定的时点时(如上图每天12:39), 触发数据刷新 强制刷新, 访问url加上\u0026amp;refresh=Y, 则强制刷新数据, 此刷新不会影响间隔或固定刷新的时间, 不会更新下次同步时间 后台触发强制刷新 (PRO) # 请参考文档 后台主动触发刷新\n"},{"id":32,"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/","title":"自定义数据源","section":"特殊数据源","content":" smartchart已实现大部分常用的数据源连接, 对于其它的, 您也可以使用python数据源进行处理 但是使用python数据源有一定的缺陷, 需要在dataset上写python代码, 不能复用 对于一些带连接信息的还需要重复写入 所以你还可以使用自定义数据源\n应用场景 # 未内置的数据源, 如需要使用sparkSQL, ES等 标准处理满足不了要求, 需要对数据进行预处理的情况 需要刷新时触发预警等自定义动作 需要自定义写入方法, 个性化查询需求, 甚至是实时爬取数据 使用方法 # 首先你需要新建一个python脚本文件, 如diy_conn.py 复制以下代码到这个文件, 然后编写你的自定义查询方法 def dataset(*args, **kwargs): \u0026#34;\u0026#34;\u0026#34; 返回查询数据集 :return: 二维数组或JSON字典 \u0026#34;\u0026#34;\u0026#34; sqlList = args[0] # 数据集编辑界面的输入已按分号拆分成数组 [sql1, sql2...] config = args[1] # 相关的配置字典{\u0026#39;host\u0026#39;,\u0026#39;port\u0026#39;,\u0026#39;user\u0026#39;,\u0026#39;password\u0026#39;,\u0026#39;db\u0026#39;} # 插入你的数据查询及处理代码, 生成result即可 result = [[]] return result def insert_dataset(*args, **kwargs): \u0026#34;\u0026#34;\u0026#34; 数据填表实现 \u0026#34;\u0026#34;\u0026#34; contents = args[0] # 传入的数据集二维数组格式 table = args[1] # 配置中的表名 config = args[3] # 相关的配置字典{\u0026#39;host\u0026#39;,\u0026#39;port\u0026#39;,\u0026#39;user\u0026#39;,\u0026#39;password\u0026#39;,\u0026#39;db\u0026#39;} # 插入你的写入数据逻辑代码 在任意的仪表盘开发界面中 \u0026ldquo;模板\u0026rdquo; \u0026ndash;\u0026gt; 点击上传图标, 将这个python文件上传即可 新建数据源, 驱动填写之前上传过的文件名, 比如我们这个是diy_conn, 其它参数按照你自定义的需求填写, 会自动传入你的自定义函数,之后你可以正常使用这个自定义数据源了 如果你对python不熟悉, 也可咨询客服按需定制, 你只需上传即可使用\n"},{"id":33,"href":"/docs/3.%E5%9B%BE%E5%BD%A2%E5%BC%80%E5%8F%91/Echarts%E7%BB%84%E4%BB%B6/","title":"Echarts组件","section":"3.图形开发","content":" 应用场景 # Smartchart提供了很多通用的图形,你可以在商店中直接使用 如果要个性化,需要你进行自定义,比如你可能需要在同一个图上展示柱形图和线性图\n开发前建意先观看视屏, 了解基础说明, 视屏有点老和现在界面不一样, 目前很多功能已经做成可视化配置, 理解过程即可, 具体以文档为准\nSmartchart数据库与图形的对话 Smartchart图形开发一 Smartchart图形开发二 获取原生echarts图形 # 首先我们在ECHART官网可能找一个你喜欢的图形, 如下简单柱形图链接: 打开我们可以看对应的option:\noption = { xAxis: { type: \u0026#39;category\u0026#39;, data: [\u0026#39;Mon\u0026#39;, \u0026#39;Tue\u0026#39;, \u0026#39;Wed\u0026#39;, \u0026#39;Thu\u0026#39;, \u0026#39;Fri\u0026#39;, \u0026#39;Sat\u0026#39;, \u0026#39;Sun\u0026#39;] }, yAxis: { type: \u0026#39;value\u0026#39; }, series: [{ data: [120, 200, 150, 80, 70, 110, 130], type: \u0026#39;bar\u0026#39; }] }; 转化为smartchart图形 # 复制到Smartchart图形编辑器， 点击菜单工具\u0026ndash;\u0026gt;转化为smartchart， 会自动进行初步转化 接下来我们就进行下改造, 请注意对比, 你只需照着复制即可\nlet dataset = __dataset__ //传入dataset let legend_label = ds_rowname(dataset) //可选, 自动获取legend let xlabel = dataset[0].splice(1) //x轴的标签列 dataset = ds_createMap(dataset) //转化成KV格式 //初始化series let series=[]; series.push({ data: dataset[legend_label[0]], //对应的第一个图列 type: \u0026#39;bar\u0026#39; }); series.push({ data: dataset[legend_label[1]], //对应的第二个图列 type: \u0026#39;line\u0026#39; }); option__name__ = { xAxis: { type: \u0026#39;category\u0026#39;, data: xlabel //X轴的标签 }, yAxis: { type: \u0026#39;value\u0026#39; }, series:series, }; charts.push(myChart__name__); 这样一个柱形+线性图就出来了\n当然一个图形还有很多其它的元素, 比如标题, legend, 等等 更多option的配置项, 可以点击”！“号图标查看，你可以直接参考echarts的设定， 完全一样！！\n以下我们做了些简单的修改\noption__name__ = { title: { text: \u0026#39;自定义图示例\u0026#39;, left: \u0026#39;center\u0026#39; }, //定义标题的显示 tooltip: { trigger: \u0026#39;item\u0026#39;, formatter: \u0026#39;{a} \u0026lt;br/\u0026gt;{b} : {c}\u0026#39; //鼠标移动提示的格式 }, legend: { left: \u0026#39;left\u0026#39;, data: legend_label }, //定义图例的显示 xAxis: { type: \u0026#39;category\u0026#39;, data: xlabel }, //定义X轴的显示 yAxis: { type: \u0026#39;value\u0026#39; }, //图例定义 series:series, }; //关于自动化series, 可以参考以下代码 var series =[]; for (let i=1;i\u0026lt;dataset[0].length;i++){ series.push({type: \u0026#39;bar\u0026#39;}) } 是不是非常简单 Smartchart让你使用echarts没有门槛\nTIPS: # 如果你在图形编辑器中可以显示图形， 但是保存后在dashboard中无法， 首先检查下所有的mychart, option是否都有转化成带__name__, 如果都有，可能原因是你的代码中有mychart.setoption， 这样你可以在代码下方加上myChart__name__.setOption(option__name__); 如果你在开发界面的仪表盘能看到图形显示，但预览仪表盘时，不显示图形，一般都是因为你图形代码中js结束需加分号(;)的地方没有添加导致的 "},{"id":34,"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/","title":"删除容器","section":"4.布局说明","content":"对于仪表盘中不再使用的数据集，你可能会考虑删除 首先smartchart推荐你不做删除，因为你可以保留他， 当你下次有新增数据集的需求时再拿出来 所以优先推荐使用隐藏的方法,你可以在数据集编辑界面找到他 如果你实在需要删除，可以在“报表”界面先中不需要容器后，选中删除，后保存\n"},{"id":35,"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/","title":"筛选器指南","section":"5.参数及联动钻取","content":" 通用实现方式 # SMARTCHART实现筛选最简单的方法只需要配一个控件即可:\n建立一个筛选清单数据集, 自动获取筛选的列表,那么可以这么写\nselect xxxx as city from tablename..... -- 则会生成一个如下的数据集: [[\u0026#39;city\u0026#39;],[选项1],[选项2],..] 良好的习惯, 先保存在数据集 然后在筛选器数据集中的js编辑器(图形编辑器),填下如下代码:\n//如要要美化, 自已加样式, 只要保证id=\u0026#34;id_select__name__\u0026#34; let dataset=__dataset__; let table =\u0026#39;\u0026lt;span\u0026gt;标题\u0026lt;/span\u0026gt;\u0026lt;select id=\u0026#34;id_select__name__\u0026#34;\u0026gt;\u0026#39;; table = table + \u0026#39;\u0026lt;option value=\u0026#34;\u0026#34; selected\u0026gt;----\u0026lt;/option\u0026gt;\u0026#39;; for(let i=1;i\u0026lt;dataset.length;i++){ table = table + \u0026#39;\u0026lt;option\u0026gt;\u0026#39; + dataset[i][0] + \u0026#39;\u0026lt;/option\u0026gt;\u0026#39;; } table = table + \u0026#39;\u0026lt;/select\u0026gt;\u0026lt;/div\u0026gt;\u0026lt;/div\u0026gt;\u0026#39; dom__name__.innerHTML=table; 这个时候你已经可以看到筛选器了\n现在我们来设定联动效果\n假设需要被筛选的数据集的SQL这样写,数据集的序号是0 那么在需要被联动的数据集中,如使用pcity做为参数写查询, 比如:\nselect xx, xx, xx from tablename /* where xx = \u0026#39;$pcity\u0026#39; */ 现在回到我们筛选器数据集,点击标题的位置, 我们需要使0号图形被筛选器联动, 设置如下即可: 然后你就可以看到筛选效果了, 非常的简单方便, 需要多个图形被联动, 只需用逗号分隔即可 比如: 0, 2, 4\n筛选器的美化请学习样式调整\n"},{"id":36,"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/","title":"上传资源文件","section":"低代码开发","content":"点击 模板开发 中的菜单即可上传你的资源文件, 如css, js, 图片等 视屏介绍说明 常规上传 # 可直接上传单个文件或zip包上传, 注意zip包中不可以有中文文件名 上传后会提示引用路径为/static/custom/仪表盘ID/\u0026hellip;\n上传为共享资源 # 可把资源打包为zip文件, 上传名以usr_开头, 如usr_tp.zip 上传完后不会有路径提示, 引用路径为/static/custom/usr_tp/\u0026hellip;.\n上传自定义数据源或jar包 # 上传后不会有路径提示\n"},{"id":37,"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/","title":"实战大屏模板转化","section":"6.进阶开发 Pro","content":" 应用场景 # 已有开发好的非smartchart静态大屏模板(这种模板非常多, 不要上当) 对js, css及smartchart已有初始了解 业务需求展示有合适的模板, 变化不大 如何使用 # 请观看系列视屏, 相信人人都会 头条视屏: 大屏模板转化系列 B站视屏: 大屏模板转化系列\n"},{"id":38,"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/","title":"单页面嵌入","section":"7.报表嵌入","content":" 嵌入报表 # 与单点登录类似, 单点登录用于直接登录到平台访问报表 但对于只嵌入报表, 用此方法更合适(需升级到5.3.11以上)\n嵌入的url: \u0026#39;/echart/?type={reportName}\u0026amp;visitor={visitor}\u0026amp;token={token}\u0026amp;stamp={stamp}\u0026#39; 参数说明： reportName： 报表名或报表ID visitor: 用户名（在smartchart平台中管理） stamp: 时间戳(1970年1月1日到生成时间的毫秒数) token: 采用sha1加密, token=SHA1(链接秘钥+stamp+visitor+reportName) 用户名和秘钥设定参考 数据服务API的config文件\n同时你需要将visitor加入到对应的报表权限查看访问\npython样列 # 以下为python版的url生成样列，你可以转化成你对应的开发语言\nimport time import hashlib import os SMART_CHART_URL = \u0026#39;http://127.0.0.1:8000\u0026#39; reportID = \u0026#39;报表ID\u0026#39; LOGIN_URL = SMART_CHART_URL + \u0026#39;/echart/?type={reportID}\u0026amp;visitor={visitor}\u0026amp;token={token}\u0026amp;stamp={stamp}\u0026#39; TOKEN = 链接秘钥 def get_smarturl(username, reportName): stamp = int(time.time() * 1000) visitor = username res = TOKEN + str(stamp) + visitor + reportID token = hashlib.sha1(res.encode(\u0026#39;utf-8\u0026#39;)).hexdigest() VISIT_DICT = { \u0026#34;visitor\u0026#34;: id, \u0026#34;stamp\u0026#34;: stamp, \u0026#34;token\u0026#34;: token, \u0026#34;reportID\u0026#34;: reportName } # 拼接好的url,直接访问 visit_url = LOGIN_URL.format(** VISIT_DICT) return visit_url 数据权限加密方法 # 如果你需要对用户进行一些数据权限控制, 可以避免用户越权访问 可以通过传入参数\u0026#34;id\u0026#34;, 如/echart/?type=xxx\u0026amp;visitor=xx\u0026amp;token=xx\u0026amp;stamp=xxxxx\u0026amp;id=xxx 后台会把这个id转化为参数名\u0026#34;_id\u0026#34;给对应的查询来进行数据权限控制 加密参数需把id加入, 例如id=john 那么 token=SHA1(链接秘钥+stamp+visitor+reportName+id) 全参数加密方法 # 如果需要将参数也加入认证中, 为保持兼容性, 我们把param这个参数改为params(具体参考参数文档中param的写法) \u0026#39;/echart/?type={reportName}\u0026amp;visitor={visitor}\u0026amp;token={token}\u0026amp;stamp={stamp}\u0026amp;params=xxxx\u0026#39; 加密参数把params加入, 例如params为 {\u0026#34;a\u0026#34;:\u0026#34;1\u0026#34;,\u0026#34;b\u0026#34;:2\u0026#34;} res = TOKEN + str(stamp) + visitor + reportName + \u0026#39;{\u0026#34;a\u0026#34;:\u0026#34;1\u0026#34;,\u0026#34;b\u0026#34;:2\u0026#34;}\u0026#39; "},{"id":39,"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/","title":"第一个仪表盘","section":"1.基础操作","content":"由于版本的变更, 一些图标可能会有一些变化, 但位置无太大的变化\n新建仪表盘 # 在开发模式下，滑动“开发管理” -\u0026gt;\u0026ldquo;仪表盘\u0026rdquo;-\u0026gt; \u0026ldquo;新增Dashboard\u0026rdquo; 填写相应信息后点击“保存” 点击进入仪表盘开发, 注意点击 \u0026ldquo;E\u0026rdquo; 字!! 点击新增(注意拖拽布局功能为PRO版本, 后续免费版本中将无法使用), 如果你坚持使用免费版本功能, 请使用新增栅格组件, 具体布局方式参考 数据集编辑 # 点开“数据集” - 输入以下SQL后，点击“保存并刷新”, 关闭数据集编辑界面 select H1 as heroname, sum(qty) as 出场数 from smartdemo2 group by H1 order by sum(qty) desc 图形编辑 # 点开“图形编辑” 点击“图形”，可以选择基础图形, 也可以使用图形商店,第一次使用可能要你进行登记，按提示操作即可， 在商店中找到合适的图形点击，会自动复制到剪贴板 贴粘到图形编辑器后，点击保存， 关闭图形编辑框 拖拽布局 # 重复以上步骤，再新增一个， 你可以使用拖拽的方式, 移动到不同的地方 "},{"id":40,"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/","title":"数据集懒加载","section":"数据集形态","content":" 应用场景 # 类似于前后端开发, 后端会提供一些接口给前端, 但前端不一定需要在一打开页面就进行查询接口, 而是当有需要时再查询, 比如数据下载, 只有当用户有下载需求时再加载, 再比如有些与后台的数据联动, 我们只需要第一次加载时只显示第一层级, 点击时再加载其它层级\n开启数据集懒加载 # 在仪表盘\u0026quot;新增\u0026quot;\u0026ndash;\u0026gt;\u0026ldquo;懒加载数据集\u0026rdquo; 这时当打开仪表盘时, 此数据集不会被加载\n应用 # 一般懒加载数据集主要是用来做数据查询的, 所以并不太需要显示图形, 所以我们主要是用于在图形中进行赋值操作 比如先在模板中定义一个全局变量: 然后修改图形编辑中的代码: 即刷新数据集时会进行变量赋值\n如果您使用VUE, 使用会更方便, 你可以直接使用vapp.变量名 = dataset进行赋值给到vue的变量空间\n查询数据 # 你可以随时手动触发数据集的刷新, 比如懒加载的数据集序号为0 你可以在你需要触发刷新的地方调用ds_refresh(0)即可刷新0号数据集并执行0号数据集中的JS代码\nTIPS 当没有修改过懒加载数据集的图形时, 默认的全局变量为 \u0026ldquo;data序号\u0026rdquo; 如懒加载数据集序号为0, 可使用data0获取数据集刷新后的数据\n"},{"id":41,"href":"/docs/3.%E5%9B%BE%E5%BD%A2%E5%BC%80%E5%8F%91/HTML%E7%BB%84%E4%BB%B6/","title":"Html组件","section":"3.图形开发","content":" 应用场景 # 输入控件,如输入框,筛选器,多选,按钮\u0026hellip; 显示组件, 文本, 图片, 视屏\u0026hellip; 表格组件 如果你还不熟悉html, 建意先花几分钟看下文档, 推荐 HTML基础 实际应用中有不熟悉的组件, 你都可以通过baidu搜索到, 如时间选择器 html组件转化为smartchart组件 # 比如我们要实现一个有多选项和按钮的网页元素 从各大搜索平台上我们可以找到html的代码是：\n\u0026lt;label\u0026gt;\u0026lt;input type=\u0026#34;checkbox\u0026#34;\u0026gt;孙尚香\u0026lt;/label\u0026gt; ..... \u0026lt;button id=\u0026#39;id_select0\u0026#39;\u0026gt;提交\u0026lt;/button\u0026gt; 那么我们可以直接在图形编辑器写上\nlet dataset=__dataset__; let table = \u0026#39;\u0026#39;; table = `\u0026lt;label\u0026gt;\u0026lt;input type=\u0026#34;checkbox\u0026#34;\u0026gt;孙一香\u0026lt;/label\u0026gt; \u0026lt;label\u0026gt;\u0026lt;input type=\u0026#34;checkbox\u0026#34;\u0026gt;孙二香\u0026lt;/label\u0026gt; \u0026lt;label\u0026gt;\u0026lt;input type=\u0026#34;checkbox\u0026#34;\u0026gt;孙三香\u0026lt;/label\u0026gt;` table = table + \u0026#34;\u0026lt;button id=\u0026#39;id_select0\u0026#39;\u0026gt;提交\u0026lt;/button\u0026gt;\u0026#34; dom__name__.innerHTML=table; 但是由于我们是要通过传入的数据动态变化的，所以只需要做简单修改\nlet dataset=__dataset__; let table = \u0026#39;\u0026#39;; for (let i=1;i\u0026lt;dataset.length;i++){ table = `${table}\u0026lt;label\u0026gt;\u0026lt;input type=\u0026#34;checkbox\u0026#34;/\u0026gt;${dataset[i][0]}\u0026lt;/label\u0026gt; ` } table = table + \u0026#34;\u0026lt;button id=\u0026#39;id_select__name__\u0026#39;\u0026gt;提交\u0026lt;/button\u0026gt;\u0026#34; dom__name__.innerHTML=table; 所有html你都可以进行转化成smartchart组件， 你可以通过学习”万能表格系列视屏“ 来了解通用组件开发 第一波 第二波 第三波\n"},{"id":42,"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/","title":"组件自定义联动","section":"5.参数及联动钻取","content":" 应用场景 # Smartchart对于单项筛选有通用的组件， 可以直接配置即可，但对于个性化的筛选，需要你进行一些简单的定制化，以下就针对多项筛选联动的需求来介绍如何定制化你的筛选联动效果 通过此例,你可以了解如何自定义任意的联动效果 样列参考 # 以我们内置的仪表盘为例，\n第一步，新建一个图形组件\n第二步，在新的数据集中编写查询\nselect distinct H1 as heroname from smartdemo2 limit 10 第三步，编辑此数据集的图形，可复制以下代码\n//select distinct xx from tablename let dataset=__dataset__; let table = \u0026#39;\u0026#39;; for (let i=1;i\u0026lt;dataset.length;i++){ table = `${table}\u0026lt;label\u0026gt;\u0026lt;input name=\u0026#34;select__name__\u0026#34; type=\u0026#34;checkbox\u0026#34; value=\u0026#34;${dataset[i][0]}\u0026#34; /\u0026gt;${dataset[i][0]}\u0026lt;/label\u0026gt; `; } table = table + \u0026#34;\u0026lt;button id=\u0026#39;id_select__name__\u0026#39;\u0026gt;提交\u0026lt;/button\u0026gt;\u0026#34;; dom__name__.innerHTML=table; $(\u0026#39;#id_select__name__\u0026#39;).click( function(){ let res = []; $(\u0026#34;input[name=\u0026#39;select__name__\u0026#39;]:checked\u0026#34;).each(function(i){ res.push(\u0026#34;\u0026#39;\u0026#34; + $(this).val() + \u0026#34;\u0026#39;\u0026#34;); }); ds_setParam(\u0026#39;H1\u0026#39;,res.toString()); //参数赋值 ds_refresh(1); //刷新1号图形 } ) 第四步，在你要联动刷新的目标数据集中增加代码\nselect H1 as heroname, sum(qty) as 出场数 from smartdemo2 where 1=1 /* and H1 in ($H1) */ group by H1 order by sum(qty) desc 这样就完成了，任何其他需求，都可以采用类似方法自定义\nTIPS 如果这个点击的图形有可能被其它图形点击联动或存在定时刷新,需要加入如下unbind否则会触发多次刷新 $(\u0026rsquo;#id_select__name__\u0026rsquo;).unbind(\u0026lsquo;click\u0026rsquo;).click(\u0026hellip;..\n如需取消联动,恢复到初始效果, 你需要删除参数, 如: delete filter_param[\u0026lsquo;H1\u0026rsquo;]\n"},{"id":43,"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/","title":"边框与装饰","section":"低代码开发","content":" 观看视屏 # 边框与装饰说明1 边框与背景说明2\n边框/装饰/背景(购买专业版提供使用方法) # "},{"id":44,"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/","title":"备份恢复及版本","section":"6.进阶开发 Pro","content":" 应用场景 # 本地仪表盘的备份恢复，版本管理 开发测试生产机之间的同步 具体使用方法请观看视屏 版本控制使用说明视屏\n使用方法 # 快速备份 # 可以在模板-\u0026gt;点击如下图标， 完成快速备份（注意会覆盖历史）， 备份号统一为：SNAPSHOT 指定备份 # 你也可以在设定-\u0026gt;备份恢复 中进行按版本备份 查询备份 # 当不输入KEY值， 点击 本地备份时，可以查询此仪表盘已有的备份 备份恢复 # 备份可以在任意的仪表盘中进行恢复，如果是当前仪表盘， 仅输入KEY即可，比如：V01, 如果是跨仪表盘恢复， KEY需要带上仪表盘的编号如13_V01\n备份恢复参数说明 # 可以支持多种恢复模式, 只需要在KEY前面加上前缀即可， 如FORCEV01, FORCE13_V01.. FORCE: 删除自身所有数据集及高级设定，模板等，完全恢复备份 DATASET：只更新数据集及图形,模板，适用于测试上线正式 CHART: 只更新图形及模板，适用于前端变更上线\n跨服务器间同步 # 具体方法购买专业版本后提供\n企业如何在使用最少资源做出最专业的可视化项目 # 前提条件: # 公司内部有技术人员(熟悉数据, 会写SQL) 服务器安装smartchart专业版 开发流程: # 由于公司内部人员是对业务最熟悉, 一般也都是后台数据管理相关的人员, 一般不太会有专职的前端开发和UI 所以数据开发人员可以使用smartchart开发仪表盘数据集, 并使用拖拽功能完成一个粗糙一点的框架和图形设计 一般情况下已经可以满足数据可视化的需求\n如果需要达到更专业的可视化效果, 可以外包前端/UI或在smartchart社区咨询, 由于需求变得非常简单 而前端开发又是一个通用技能, 可以使用非常廉价的费用获得最大的效果\n专业的事情专业来做, 才能达到效益最大化, 这是smartchart的设计理念 不管用什么工具, 在同等资源的投入下, 数据分析人员开发的可视化效果很难达到专业前端UI的效果 另外BI/数据开发人员的费用可是比前端高的, 也更稀缺\n前端开发只需本地安装smartchart, 而无需接触到公司数据库或数据接口, 开发完全解耦, 数据安全保障 smartchart可以将数据开发人员开发的仪表盘直接同步到前端开发的本地smartchart(仅会保留demo数据) 前端进行一些简单的美化工作即可, 无需对业务和数据进行理解, 花费的时间非常之少 前端开发完成后可以一键同步到smartchart服务端, 且可以只同步可视化部分 由于数据和展示是分离的, 所以数据开发和前端美化是可以同步进行 由于smartchart是一个平台化产品, 数据开发人员不熟悉前端也能在前端开发完成的基础上进行样式和图形的修改 "},{"id":45,"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/","title":"数据下载","section":"数据服务","content":" 应用场景: # 需要要下载数据集的数据到本地\n使用方法 # 仅需要录活使用ds_download这个函数, 你可以开发出非常个性化的下载功能\nds_download(name, dataset) 参数说明: name: 文件名称 dataset: 可以是二维数组也可以是字符串 样例: # 可在\u0026quot;模板\u0026quot; 中新建一个下载按钮, 并指定一个ID,如id_down1, 拖拽到你需要的位置 在任意一个图形开发或js代码段中加入以下代码即可\n$(\u0026#39;#id_down1\u0026#39;).click(()=\u0026gt;{ ds_download(\u0026#39;报表数据.csv\u0026#39;, dataset); }); 这样就可以实现点击按钮下载数据了\n"},{"id":46,"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/","title":"第一个复杂报表","section":"1.基础操作","content":" 新建仪表盘 # 在开发模式下，滑动“开发管理” -\u0026gt;\u0026ldquo;仪表盘\u0026rdquo;-\u0026gt; \u0026ldquo;新增Dashboard\u0026rdquo; 填写相应信息后点击“保存” 点击进入仪表盘开发, 注意点击 \u0026ldquo;E\u0026rdquo; 字!! 点击新增\u0026ndash;\u0026gt;复杂报表 数据集编辑 # 点开“数据集” 输入以下SQL后，点击“保存并刷新”, 关闭数据集编辑界面 select H1 as 英雄名称, sum(qty) as 英雄1出场数 from smartdemo2 group by H1 order by sum(qty) desc; select count(1) as 总出场数 from smartdemo2 报表页面开发 # 和excel一样, 编辑相应表格 点击\u0026quot;数据集图标\u0026quot;(再次点击隐藏), 显示数据集字段名, 选中单元格, 单击字段名填入 点击\u0026quot;获取数据\u0026quot;, 可对真实数据调整样式 点击\u0026quot;保存\u0026quot; 点击\u0026quot;预览\u0026quot;, 可查看最终效果 导入EXCEL/WPS开发的模板 # 你也可直接导入excel或wps开发好的模板, 点击左下方的上传即可\n当然我们还有更多可定制的功能, 自行探索吧 也可购买专业版本解锁高级用法\n"},{"id":47,"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/","title":"调试日志","section":"3.图形开发","content":" 关于页面日志查看 # 大家可能比较熟悉使用F12来查看网页日志, 但有的同学会觉得这不够方便, 所以 smartchart加入了可以页面直接显示日志的功能\n在仪表盘中显示 # 你只需要点击如下菜单, 即可切换是否显示日志 当在刷新页面或执行时, 日志将直接显示在右下角中, 而且还能显示出对应出错的图表序号 在图形中显示 # smartchart基于python的使用习惯, 重定义的专用的日志打印函数print 你可以在图形编辑器中使用些函数即可打印日志 比如看看鼠标放在echarts图上params, 在编辑界面和console中都能看到日志, 方便你进行调试 更多应用 # 不仅仅这些, 你可能会想写太多打印日志, 上线了不好 smartchart已为你想到这些, 如果你在仪表盘中没有开启日志显示, print函数是不会打印任何日志\n有了仪表盘日志显示, 我们还能做更多的事情, 比如实时显示你拖拽的坐标, 让你精确定位 "},{"id":48,"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/","title":"样式快速上手","section":"低代码开发","content":" 样式操作: # 要想大屏做得好, 样式要写得好 可是我们不是前端的同学也能写样式么 当然可以, 相信你观看完以下视屏即可\n快速上手样式开发\n基础样式入门: # CSS介绍 # CSS（Cascading Style Sheet，层叠样式表)定义如何显示HTML元素。 当浏览器读到一个样式表，它就会按照这个样式表来对文档进行格式化（渲染）。\nCSS语法 # CSS实例 每个CSS样式由两个组成部分：选择器和声明。声明又包括属性和属性值。每个声明之后用分号结束。 CSS注释\n/*这是注释*/ 注释是代码之母, smartchart编辑中你可以使用CTRL+/快捷注释\nCSS的几种引入方式 行内样式 行内式是在标记的style属性中设定CSS样式。不推荐大规模使用。\n\u0026lt;p style=\u0026#34;color: red\u0026#34;\u0026gt;Hello world.\u0026lt;/p\u0026gt; 内部样式 嵌入式是将CSS样式集中写在网页的标签对的标签对中。格式如下：\n\u0026lt;head\u0026gt; \u0026lt;style\u0026gt; p{ background-color: #2b99ff; } \u0026lt;/style\u0026gt; \u0026lt;/head\u0026gt; 外部样式 外部样式就是将css写在一个单独的文件中\n\u0026lt;link href=\u0026#34;mystyle.css\u0026#34; rel=\u0026#34;stylesheet\u0026#34; type=\u0026#34;text/css\u0026#34;/\u0026gt; CSS选择器 # 基本选择器\n/*元素选择器*/ p {color: \u0026#34;red\u0026#34;;} /*ID选择器*/ #i1 { background-color: red; } /*类选择器*/ .c1 { font-size: 14px; } p .c1 { color: red; } 注意： 样式类名不要用数字开头（有的浏览器不认）。 标签中的class属性如果有多个，要用空格分隔。\n通用选择器\n* { color: white; } 组合选择器\n/*后代选择器*/ /*li内部的a标签设置字体颜色*/ li a { color: green; } /*儿子选择器*/ /*选择所有父级是 \u0026lt;div\u0026gt; 元素的 \u0026lt;p\u0026gt; 元素*/ div\u0026gt;p { font-family: \u0026#34;Arial Black\u0026#34;, arial-black, cursive; } /*毗邻选择器*/ /*选择所有紧接着\u0026lt;div\u0026gt;元素之后的\u0026lt;p\u0026gt;元素*/ div+p { margin: 5px; } /*弟弟选择器*/ /*i1后面所有的兄弟p标签*/ #i1~p { border: 2px solid royalblue; } /*属性选择器*/ /*用于选取带有指定属性的元素。*/ p[title] { color: red; } /*用于选取带有指定属性和值的元素。*/ p[title=\u0026#34;213\u0026#34;] { color: green; } /*找到所有title属性以hello开头的元素*/ [title^=\u0026#34;hello\u0026#34;] { color: red; } /*找到所有title属性以hello结尾的元素*/ [title$=\u0026#34;hello\u0026#34;] { color: yellow; } /*找到所有title属性中包含（字符串包含）hello的元素*/ [title*=\u0026#34;hello\u0026#34;] { color: red; } /*找到所有title属性(有多个值或值以空格分割)中有一个值为hello的元素：*/ [title~=\u0026#34;hello\u0026#34;] { color: green; } 分组和嵌套\n分组 当多个元素的样式相同的时候，我们没有必要重复地为每个元素都设置样式，我们可以通过在多个选择器之间使用逗号分隔的分组选择器来统一设置元素样式。 例如： div, p { color: red; } 上面的代码为div标签和p标签统一设置字体为红色。 嵌套 多种选择器可以混合起来使用，比如：.c1类内部所有p标签设置字体颜色为红色。 .c1 p { color: red; } 伪类选择器\n/* 未访问的链接 */ a:link { color: #FF0000 } /* 鼠标移动到链接上 */ a:hover { color: #FF00FF } /* 选定的链接 */ a:active { color: #0000FF } /* 已访问的链接 */ a:visited { color: #00FF00 } /*input输入框获取焦点时样式*/ input:focus { outline: none; background-color: #eee; } 伪元素选择器\n/*first-letter*/ /*常用的给首字母设置特殊样式：*/ p:first-letter { font-size: 48px; color: red; } before /*在每个\u0026lt;p\u0026gt;元素之前插入内容*/ p:before { content:\u0026#34;*\u0026#34;; color:red; } after /*在每个\u0026lt;p\u0026gt;元素之后插入内容*/ /*before和after多用于清除浮动。*/ p:after { content:\u0026#34;[?]\u0026#34;; color:blue; } 选择器的优先级 # CSS继承 继承是CSS的一个主要特征，它是依赖于祖先-后代的关系的。继承是一种机制，它允许样式不仅可以应用于某个特定的元素，还可以应用于它的后代。例如一个body定义了的字体颜色值也会应用到段落的文本中。 body { color: red; } 此时页面上所有标签都会继承body的字体颜色。然而CSS继承性的权重是非常低的，是比普通元素的权重还要低的0。 我们只要给对应的标签设置字体颜色就可覆盖掉它继承的样式。 p { color: green; } 选择器的优先级 我们上面学了很多的选择器，也就是说在一个HTML页面中有很多种方式找到一个元素并且为其设置样式，那浏览器根据什么来决定应该应用哪个样式呢？ 其实是按照不同选择器的权重来决定的，具体的选择器权重计算方式如下图： 除此之外还可以通过添加 !important方式来强制让样式生效，但并不推荐使用。 因为如果过多的使用!important会使样式文件混乱不易维护。 万不得已可以使用!important\nCSS属性相关 # 宽和高\nwidth属性可以为元素设置宽度。 height属性可以为元素设置高度。 块级标签才能设置宽度，内联标签的宽度由内容来决定。 字体属性\n文字字体 font-family可以把多个字体名称作为一个“回退”系统来保存。如果浏览器不支持第一个字体，则会尝试下一个。浏览器会使用它可识别的第一个值。 简单实例： body { font-family: \u0026#34;Microsoft Yahei\u0026#34;, \u0026#34;微软雅黑\u0026#34;, \u0026#34;Arial\u0026#34;, sans-serif } 字体大小 p { font-size: 14px; } 如果设置成inherit表示继承父元素的字体大小值。 字重（粗细） font-weight用来设置字体的字重（粗细）。 值描述normal默认值，标准粗细bold粗体bolder更粗lighter更细100~900设置具体粗细，400等同于normal，而700等同于boldinherit继承父元素字体的粗细值 文本颜色 color 颜色是通过CSS最经常的指定： 十六进制值 - 如: ＃FF0000 一个RGB值 - 如: RGB(255,0,0) 颜色的名称 - 如: red 还有rgba(255,0,0,0.3)，第四个值为alpha, 指定了色彩的透明度/不透明度，它的范围为0.0到1.0之间。 文字属性\n文字对齐 text-align 属性规定元素中的文本的水平对齐方式。 值描述left左边对齐 默认值right右对齐center居中对齐justify两端对齐 文字装饰 text-decoration 属性用来给文字添加特殊效果。 值描述none默认。定义标准的文本。underline定义文本下的一条线。overline定义文本上的一条线。line-through定义穿过文本下的一条线。inherit继承父元素的text-decoration属性的值。 常用的为去掉a标签默认的自划线： a { text-decoration: none; } 首行缩进 将段落的第一行缩进 32像素： p { text-indent: 32px; } 背景属性\n/*背景颜色*/ background-color: red; /*背景图片*/ background-image: url(\u0026#39;1.jpg\u0026#39;); /* 背景重复 repeat(默认):背景图片平铺排满整个网页 repeat-x：背景图片只在水平方向上平铺 repeat-y：背景图片只在垂直方向上平铺 no-repeat：背景图片不平铺 */ background-repeat: no-repeat; /*背景位置*/ background-position: left top; /*background-position: 200px 200px;*/ 支持简写： background:#336699 url(\u0026#39;1.png\u0026#39;) no-repeat left top; 使用背景图片的一个常见案例就是很多网站会把很多小图标放在一张图片上，然后根据位置去显示图片。减少频繁的图片请求。 边框\n/*边框属性*/ border-width border-style border-color #i1 { border-width: 2px; border-style: solid; border-color: red; } /*通常使用简写方式：*/ #i1 { border: 2px solid red; } /*边框样式 值描述none无边框。dotted点状虚线边框。dashed矩形虚线边框。solid实线边框。*/ /*除了可以统一设置边框外还可以单独为某一个边框设置样式，如下所示：*/ #i1 { border-top-style:dotted; border-top-color: red; border-right-style:solid; border-bottom-style:dotted; border-left-style:none; } /*border-radius属性能实现圆角边框的效果。*/ /*将border-radius设置为长或高的一半即可得到一个圆形。*/ display属性\n用于控制HTML元素的显示效果。 值意义display:\u0026#34;none\u0026#34;HTML文档中元素存在，但是在浏览器中不显示。一般用于配合JavaScript代码使用。display:\u0026#34;block\u0026#34;默认占满整个页面宽度，如果设置了指定宽度，则会用margin填充剩下的部分。display:\u0026#34;inline\u0026#34;按行内元素显示，此时再设置元素的width、height、margin-top、margin-bottom和float属性都不会有什么影响。display:\u0026#34;inline-block\u0026#34;使元素同时具有行内元素和块级元素的特点。 display:\u0026#34;none\u0026#34;与visibility:hidden的区别： visibility:hidden: 可以隐藏某个元素，但隐藏的元素仍需占用与未隐藏之前一样的空间。也就是说，该元素虽然被隐藏了，但仍然会影响布局。 display:none: 可以隐藏某个元素，且隐藏的元素不会占用任何空间。也就是说，该元素不但被隐藏了，而且该元素原本占用的空间也会从页面布局中消失。 CSS盒子模型\nmargin: 用于控制元素与元素之间的距离；margin的最基本用途就是控制元素周围空间的间隔，从视觉角度上达到相互隔开的目的。 padding: 用于控制内容与边框之间的距离； Border(边框): 围绕在内边距和内容外的边框。 Content(内容): 盒子的内容，显示文本和图像。 margin外边距 .margin-test { margin-top:5px; margin-right:10px; margin-bottom:15px; margin-left:20px; } 推荐使用简写： .margin-test { margin: 5px 10px 15px 20px; } 顺序：上右下左 常见居中： .mycenter { margin: 0 auto; } padding内填充 .padding-test { padding-top: 5px; padding-right: 10px; padding-bottom: 15px; padding-left: 20px; } 推荐使用简写： .padding-test { padding: 5px 10px 15px 20px; } 顺序：上右下左 补充padding的常用简写方式： 提供一个，用于四边； 提供两个，第一个用于上－下，第二个用于左－右； 如果提供三个，第一个用于上，第二个用于左－右，第三个用于下； 提供四个参数值，将按上－右－下－左的顺序作用于四边； float\n在 CSS 中，任何元素都可以浮动。 浮动元素会生成一个块级框，而不论它本身是何种元素。 关于浮动的两个特点： 浮动的框可以向左或向右移动，直到它的外边缘碰到包含框或另一个浮动框的边框为止。 由于浮动框不在文档的普通流中，所以文档的普通流中的块框表现得就像浮动框不存在一样。 三种取值 left：向左浮动 right：向右浮动 none：默认值，不浮动 overflow溢出属性\n值描述visible默认值。内容不会被修剪，会呈现在元素框之外。hidden内容会被修剪，并且其余内容是不可见的。scroll内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。auto如果内容被修剪，则浏览器会显示滚动条以便查看其余的内容。inherit规定应该从父元素继承 overflow 属性的值。 overflow（水平和垂直均设置） overflow-x（设置水平方向） overflow-y（设置垂直方向） 定位（position）\nstatic static 默认值，无定位，不能当作绝对定位的参照物，并且设置标签对象的left、top等值是不起作用的的。 relative（相对定位） 相对定位是相对于该元素在文档流中的原始位置，即以自己原始位置为参照物。有趣的是，即使设定了元素的相对定位以及偏移值，元素还占有着原来的位置，即占据文档流空间。对象遵循正常文档流，但将依据top，right，bottom，left等属性在正常文档流中偏移位置。而其层叠通过z-index属性定义。 注意：position：relative的一个主要用法：方便绝对定位元素找到参照物。 absolute（绝对定位） 定义：设置为绝对定位的元素框从文档流完全删除，并相对于最近的已定位祖先元素定位，如果元素没有已定位的祖先元素，那么它的位置相对于最初的包含块（即body元素）。元素原先在正常文档流中所占的空间会关闭，就好像该元素原来不存在一样。元素定位后生成一个块级框，而不论原来它在正常流中生成何种类型的框。 重点：如果父级设置了position属性，例如position:relative;，那么子元素就会以父级的左上角为原始点进行定位。这样能很好的解决自适应网站的标签偏离问题，即父级为自适应的，那我子元素就设置position:absolute;父元素设置position:relative;，然后Top、Right、Bottom、Left用百分比宽度表示。 另外，对象脱离正常文档流，使用top，right，bottom，left等属性进行绝对定位。而其层叠通过z-index属性定义。 fixed（固定） fixed：对象脱离正常文档流，使用top，right，bottom，left等属性以窗口为参考点进行定位，当出现滚动条时，对象不会随着滚动。而其层叠通过z-index属性 定义。 注意点： 一个元素若设置了 position:absolute | fixed; 则该元素就不能设置float。这 是一个常识性的知识点，因为这是两个不同的流，一个是浮动流，另一个是“定位流”。但是 relative 却可以。因为它原本所占的空间仍然占据文档流。 在理论上，被设置为fixed的元素会被定位于浏览器窗口的一个指定坐标，不论窗口是否滚动，它都会固定在这个位置。 z-index\n#i2 { z-index: 999; } 设置对象的层叠顺序。 z-index 值表示谁压着谁，数值大的压盖住数值小的， 只有定位了的元素，才能有z-index,也就是说，不管相对定位，绝对定位，固定定位，都可以使用z-index，而浮动元素不能使用z-index z-index值没有单位，就是一个正整数，默认的z-index值为0如果大家都没有z-index值，或者z-index值一样，那么谁写在HTML后面，谁在上面压着别人，定位了元素，永远压住没有定位的元素。 从父现象：父亲怂了，儿子再牛逼也没用 opacity 用来定义透明效果。取值范围是0~1，0是完全透明，1是完全不透明。\n"},{"id":49,"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/","title":"数据填报","section":"数据服务","content":" 应用场景 # 收集用户端录入的数据 前端处理好的数据回写到任意系统 制做问卷系统 埋点应用 使用方法 # 新建一个懒加载数据集,填写内容格式如下: # 如果需将数据保存到对应的表名 dataset={ \u0026#34;table\u0026#34;:\u0026#34;表名\u0026#34; } 如需指定字段, 可如下方式填写 dataset={ \u0026#34;table\u0026#34;:\u0026#34;表名(字段1, 字段2)\u0026#34; } 在\u0026quot;模板\u0026quot;中编写录入组件代码, # 具体可参考视屏\n\u0026lt;h1 class=\u0026#34;smtdrag\u0026#34; id=\u0026#34;id_1648895680659\u0026#34;\u0026gt;数据填报\u0026lt;/h1\u0026gt; \u0026lt;div class=\u0026#34;smtdrag\u0026#34; id=\u0026#34;id_1648895855760\u0026#34;\u0026gt; \u0026lt;label\u0026gt;用户\u0026lt;/label\u0026gt;\u0026lt;input id=\u0026#34;id_visitor\u0026#34;\u0026gt; \u0026lt;/div\u0026gt; \u0026lt;div class=\u0026#34;smtdrag\u0026#34; id=\u0026#34;id_1648895859160\u0026#34;\u0026gt; \u0026lt;label\u0026gt;动作\u0026lt;/label\u0026gt;\u0026lt;input id=\u0026#34;id_action\u0026#34;\u0026gt; \u0026lt;/div\u0026gt; \u0026lt;div class=\u0026#34;smtdrag\u0026#34; id=\u0026#34;id_1648895956207\u0026#34;\u0026gt; \u0026lt;button id=\u0026#34;idbtn01\u0026#34;\u0026gt;提交\u0026lt;/button\u0026gt; \u0026lt;/div\u0026gt; 在\u0026quot;模板\u0026quot; 中编写JS代码 $(\u0026#39;#idbtn01\u0026#39;).click(function(){ //获取填写的数据 let visitor = $(\u0026#39;#id_visitor\u0026#39;).val(); let action = $(\u0026#39;#id_action\u0026#39;).val(); //拼接一个填写好的数组 let dataset = [visitor, action]; //上传填写的数据 //0:为上文新建的数据集序号, dataset:要写入的数据 print(ds_save(0, dataset)); }) 更多关于写入数据库的数据集格式说明 # //只写入一行数据, 样列如下: dataset = [\u0026#39;a\u0026#39;,\u0026#39;b\u0026#39;] //同时写入多行数据: dataset = [[], [\u0026#39;a1\u0026#39;,\u0026#39;b1\u0026#39;],[\u0026#39;a2\u0026#39;, \u0026#39;b2\u0026#39;]] //如果需要自动记录写入者用户名: dataset = [\u0026#39;$username\u0026#39;, \u0026#39;b\u0026#39;] mongodb写入方式\nds_save(0, {\u0026#34;h1\u0026#34;:123, \u0026#34;h2\u0026#34;:\u0026#34;bb\u0026#34;}); ds_save(0, [[],{\u0026#34;h1\u0026#34;:123, \u0026#34;h2\u0026#34;:\u0026#34;aa\u0026#34;},{\u0026#34;h1\u0026#34;:1234, \u0026#34;h2\u0026#34;:\u0026#34;dd\u0026#34;}]); "},{"id":50,"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/","title":"自定义首页","section":"6.进阶开发 Pro","content":" 应用场景 # 需要用户打开首页时直接查看相应报表 自定义人性化的首页显示 使用方法 # 如果已经有开发好的仪表盘页面, 可以找到它的访问url, 如:/echart/?type=2 设置系统环境变量 SMC_HOME_PAGE=/echart/?type=2 如果你使用django部署, 也可以采用在setting.py中加入配置: SMC_HOME_PAGE=\u0026#39;/echart/?type=2\u0026#39; 这样就可以在首页直接显示设定好的页面了\n"},{"id":51,"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/","title":"第一个3D场景","section":"1.基础操作","content":" 新建仪表盘 # 在开发模式下，滑动“开发管理” -\u0026gt;\u0026ldquo;仪表盘\u0026rdquo;-\u0026gt; \u0026ldquo;新增Dashboard\u0026rdquo; 填写相应信息后点击“保存” 点击进入仪表盘开发, 注意点击 \u0026ldquo;E\u0026rdquo; 字!! 点击\u0026quot;设定\u0026quot; -\u0026gt; \u0026ldquo;高级设定\u0026rdquo; -\u0026gt; \u0026ldquo;开启模板\u0026rdquo; 此时可以在工具栏中看到\u0026quot;模板\u0026quot;, 点击进入模板开发 上传模型文件 # 在模板开发界面中, 点击\u0026quot;工具\u0026quot; -\u0026gt; \u0026ldquo;文件上传\u0026rdquo;, 上传你的模型文件, 支持\u0026quot;obj,stl,gltf\u0026quot;格式 上传后点击下方文件, 将自动复制资源链接 场景开发 # 在模板开发界面,将第一行\u0026quot;base.html\u0026quot;修改为\u0026quot;base3d.html\u0026quot; 鼠标放在如下图script标签内, 点击菜单\u0026quot;3D模型\u0026quot; -\u0026gt; \u0026ldquo;加载模型\u0026rdquo; 将上一步中复制出的模型链接, 替换模型url 点击保存, 即可看到3D场景, 不过可能模型过大或过小, 可以进行调整相机景深 点击菜单\u0026quot;3D模型\u0026quot; -\u0026gt; \u0026ldquo;相机景深\u0026rdquo;, 使模型大小到合适 点击\u0026quot;环境光\u0026quot;和\u0026quot;点光源\u0026quot;设定 点击旋转动画, 模型会自动旋转 更多功能可自行探索, 比如交互点击响应事件, 贴图等 也可购买专业版本解锁高级用法\n"},{"id":52,"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/","title":"ID E开发模式","section":"低代码开发","content":" 应用场景 # 如果您是一个资深的前端开发者 可能不需要使用smartchart组件,仅需使用到数据集 你希望在IDE(如VS code)中开发然后打包发布 非专用人士,请不要尝试这种方式 开发方式 # 在模板中使用basesimple 此时smartchart不会引用任何echarts, vue组件, 完全由您自已控制引入\n如何使用数据集接口 # 在仪表中新增懒加载数据集 修改对应图形编辑器, 使数据赋值给一个全局变量或vue 在IDE中开发 # 由于你在开发中仅需要用到filter_param及ds_refresh, 建意新建一个js文件, 文件内容:\n//以下为辅助方法, 发布时, 无需放入smartchart模板中 var filter_param = {}; function ds_refresh(num){ if(num === 0){你对应的图形中赋值代码,调试代码} if(num === 1){....} ...... } 然后将这个js文件在你的项目中引用调试使用\n如何部署到smartchart # 打包完成后会有相应的css, js 和index.html文件, 将index.html中的代码复制贴粘到对应的模板区域中即可\n上传css,js 修改css,js 相关引用路径 去除之前定义的js辅助开发文件引用, 如果有定义全局变量, 将全局变量定义复制到模板js区域 "},{"id":53,"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/","title":"后台 Api刷新","section":"数据服务","content":" 应用场景 # 有ETL流程，需要等待后台数据刷新完成后，再触发仪表盘的刷新，数据未完成刷新，仪表盘不刷新 针对有一些耗时的查询, 虽然smartchart有缓存加速, 但是在第一次刷新时可能不能达到极速 用户需要随时都能体验到极速的打开效果 使用后台API刷新，建意将仪表盘中数据集的缓存时间设置长一些，比如2天（2880分钟）\n后台数据主动刷新接口 # (购买专业版本后支持)\n你需要在setting.py中设定API_TOKEN API_TOKEN = \u0026#39;xxxxxxxx\u0026#39; 找到你要刷新的仪表盘编码, 你可以在打开的仪表盘url上面找到这个type id\n后台访问如下api url即可\nhttp://ip:端口/echart/refresh_ds/?type=你的报表ID\u0026amp;token=你设定的API_TOKEN 关于定时刷新 # 为保持产品的轻量化及坚持专业的产品做专业的事情, 归一化统一化的架构设计, 我们不会集成相关调度系统, 一般我们推荐使用您自有的调度工具或平台, 如airflow, 我们也有相关的配套产品\n如果您仅仅是简单应用, 也无需使用专用调度来增加运维复杂度, 可以使用linux自带的即可\n新建一个sh文件, 假设目录在/data/smartchart vim refresh_smartchart.sh 写入需要刷新的脚本 echo start refresh $(date \u0026#34;+%Y-%m-%d %H:%M:%S\u0026#34;) curl http://ip:端口/echart/?type=你的报表ID1\u0026amp;token=你设定的API_TOKEN curl http://ip:端口/echart/?type=你的报表ID2\u0026amp;token=你设定的API_TOKEN echo end refresh $(date \u0026#34;+%Y-%m-%d %H:%M:%S\u0026#34;) 如果你的网址是https, 可如下方法使用curl\ncurl -k --insecure \u0026#34;https://www.baidu.com” 修改为可执行文件 chmod 775 refresh_smartchart.sh 使用crontab来定时执行 # 编辑crontab crontab -e # 比如需要每天晚上5点10分执行 10 5 * * * /data/smartchart/refresh_smartchart.sh \u0026gt;\u0026gt;/data/smartchart/log.txt 2\u0026gt;\u0026amp;1 # 定时参数说明 * * * * * - - - - - | | | | | | | | | +----- 星期中星期几 (0 - 6) (星期天 为0) | | | +---------- 月份 (1 - 12) | | +--------------- 一个月中的第几天 (1 - 31) | +-------------------- 小时 (0 - 23) +------------------------- 分钟 (0 - 59) "},{"id":54,"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/","title":"第一个上线数据集","section":"1.基础操作","content":"实在想不出用什么名称来描述这个功能, 将就这个吧\n应用场景 # 数据集和图形复用, 开发完成后可以直接在仪表盘中拖拽 制做指标体系供用户使用,实现0代码功能 非常适合于OEM场景 新建数据集 # 在开发菜单 \u0026ndash;\u0026gt; 数据集 \u0026ndash;\u0026gt; 新增 \u0026ndash;\u0026gt; 保存 在数据集列表中 \u0026ndash;\u0026gt; 点图标E \u0026ndash;\u0026gt; 进入数据集编辑器 开发完成数据后, 点击数据集编辑器, 保存数据集后点击进入图形开发,如下图 调整图形保存即可, 此方法新增的数据集默认为上线状态 按相同的方法, 新增几个数据集 在仪表盘中使用上线数据集 # 进入仪表盘开发界面 点击\u0026quot;新增\u0026quot; \u0026ndash;\u0026gt; \u0026ldquo;上线数据集\u0026rdquo;, 点击相应的数据集 即可在仪表盘中显示出此\u0026quot;上线数据集\u0026quot; 仪表盘中的上线数据集开发 # 上线数据集在仪表盘中不可以修改, 如需修改数据集, 按如下图复制出来后即可修改 "},{"id":55,"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/","title":"Web Socket方式","section":"特殊数据源","content":" 应用场景 # 对于实时程度要求比较高的情况下, 如果你后端已有实现websocket的接口, smartchart也可以很方便的接入 参考以下步骤即可\n在\u0026quot;模板\u0026quot;中定义一个全局变量, 如ws_data 编写连接和接收代码段逻辑 在接收代码段加入ds_refresh, 如要刷新0号图形, 则加入ds_refresh(0) 在\u0026quot;高级\u0026quot;设定中加入共享数据集设定, 把ws_data映射到0号图形即可 代码段参考 # let ws_data = [[\u0026#39;初始化\u0026#39;,\u0026#39;V\u0026#39;],[\u0026#39;A\u0026#39;,\u0026#39;2\u0026#39;]]; let ws = null; if(\u0026#39;webSocket\u0026#39; in window){ print(\u0026#39;支持webSocket\u0026#39;); ws = new webSocket(\u0026#39;ws://127.0.0.1:2222/abc\u0026#39;); //连接成功 ws.onopen = function(){ print(\u0026#39;ws连接成功\u0026#39;); } //接收消息 ws.onmessage = function(evt){ ws_data = evt.data; ds_refresh(0); } } else{ print(\u0026#39;浏览器不支持ws\u0026#39;) } "},{"id":56,"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/","title":"动画效果","section":"低代码开发","content":" 自动旋转效果 # 在\u0026quot;模板\u0026quot;的style中加入以下样式\n@-webkit-keyframes spin { from {-webkit-transform: rotate(0deg);} to {-webkit-transform: rotate(360deg);} } @keyframes spin { from {transform: rotate(0deg);} to {transform: rotate(360deg);} } .Rotate { -webkit-animation: spin 3s linear 3s 5 alternate; animation: spin 3s linear infinite; } 如需任意组件自动旋转, 只需将Rotate这个类给到这个组件即可, 比如图形\n\u0026lt;img class=\u0026#34;Rotate\u0026#34; src=\u0026#34;https://www.smartchart.cn/media/editor/smc162_20220407150432307320.png\u0026#34;\u0026gt; 组件变形 # 常见变形沿着Y轴, 其它变形方式自已搜索, 比如需要0号,1号图形变形的样式写法\n#container_0{transform:skewY(10deg);} #container_1{transform:skewY(-10deg);} 效果如下: "},{"id":57,"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/","title":"创建连接池","section":"1.基础操作","content":" 如何新增数据源 # 在开发模式下，点击“开发管理”-\u0026gt;数据源-\u0026gt;新增 配置连接池参数，注意数据库填写是备注中有写的名称 你可以通过新建一个数据集来测试连接池的连通性\n点击“保存” 后，回到数据集列表 点击如下图标\u0026quot;E\u0026quot;，进入数据集开发界面 在开发界面调试 安全控制 # 你可以在“参数”中设定安全控制，可避免用户误操作导致前后端卡死 limit: 可限定最大返回数据数量(但实际数据库查询无limit,需通过mode控制) mode: 控制用户查询行为，默认为模式1\n模式 说明 0 严格模式，每次查询向数据库都会增加limit，MPP类型数据库可能会排序失效 1 开发模式，仅调试查询数据库都会增加limit，调试时MPP类型数据库可能会排序失效，但不影响实际 2 宽松模式，查询都不带limit, 仅控制返回limit,需开发者避免大查询 支持的数据源： # 数据库 驱动填写 需安装 使用说明 Mysql mysql 默认支持 Mysql连接池 mysqlpool Sqlite sqlite 默认支持 连接地址填写绝对路径 API 任意 默认支持 参考数据集说明文档 EXCEL 任意 默认支持 参考数据集说明文档 SQL Server mssql 需安装 pip install pymssql SQL Server连接池 mssqlpool ORACLE oracle pip install cx_Oracle ORACLE连接池 oraclepool PostgreSql gp pip install psycopg2 GP gp pip install psycopg2 Impala impala pip install impyla Hive hive pip install impyla DB2 db2 pip install ibm_db 达梦 dm pip install dmPython Python python pip install pandas, openpyxl 参考数据集-\u0026gt;特殊数据源 Redis redis pip install redis 参考数据集-\u0026gt;特殊数据源 Mongodb mongodb pip install pymongo 参考数据集-\u0026gt;特殊数据源 Clickhouse clickhouse pip install clickhouse_driver Elasticsearch es pip install elasticsearch==7.13.0 参考数据集-\u0026gt;特殊数据源 Prometheus prometheus 参考数据集-\u0026gt;特殊数据源 influxdb influxdb pip install influxdb Sqlalchemy sqlalchemy pip install sqlalchemy 参考数据集-\u0026gt;特殊数据源 JDBC jdbc pip install JayDeBeApi 参考数据集-\u0026gt;特殊数据源 自定义 自定义 用户自由定义 参考数据集-\u0026gt;特殊数据源 "},{"id":58,"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/","title":"编辑器快捷键","section":"低代码开发","content":" 功能 WIN MAC 说明 显示菜单 CTRL-, Command-, 折叠其它 Alt-0 Command-Option-0 查找替换 Ctrl-F Command-F 重复选中 Ctrl-D Command-D 注释选中 Ctrl-/ Command-/ 取消修改 Ctrl-z Command-z 重新执行 Ctrl-y Command-y 数据集编辑 Ctrl-Q Ctrl-Q 选中大写 Ctrl-U Ctrl-U 选中小写 SHIFT-Ctrl-U SHIFT-Ctrl-U "},{"id":59,"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/","title":"应用模板","section":"1.基础操作","content":" 应用场景 # 你可以快速应用开发好的模板,极大的提高你的开发和学习效率\n应用本地模板 # 你可以快速应用本地备份的模板, 我们内置了一个 通用的数据查询和下载模板 , 你可以尝试\n新建一个全新的dashboard, 不要放任何报表, 点击保存且编辑后, 下方可以看到下载链接, 然后点击下载即可直接应用 输入\u0026quot;01_SMARTCHART\u0026quot;, 点击本地恢复即可 更多本地备份恢复参考\n应用商店模板 # 方法同上\u0026quot;应用本地模板\u0026quot;, 注意应用商店模板为收费增值服务\n你可以点击 模板查询, 查看相应的价格后在 TB购买即可获取下载密钥 如果是全新的仪表盘, 直接输入下载密钥, 点击\u0026quot; 商城下载 \u0026ldquo;即可 如果仪表盘中有数据集且不再需要, 可以在下载密钥前面加上FORCE即可自动清空已有数据集后自动下载 注意模板太廉价,购买后并没有咨询服务,请务必自行了解如何使用\n资源文件放置路径 有些资源会离线打包提供给你, 只需上传即可, 上传方法参考\n如果不清楚可以观看视屏说明 使用方法可参考视屏: 一键应用模板\n"},{"id":60,"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/","title":"权限管理","section":"1.基础操作","content":"目前的权限管理,大概如下:\n开发者权限 # 点击进入后台的图标, 在后台中你可以控制用户的开发权限 新建用户默认是没有开发权限的, 在首页也看不到任何开发相关的菜单\n如果你需要给用户开发权限, 需要设定如下: Dashboard报表查看权限 # 你可以在 仪表盘设定 中进行权限管理 在dashboard设定页面中可针对人员来分配 编辑权限, 有编辑权限同时也会满足查看权限 在dashboard设定页面中可针对组来分配 查看权限 未上线 的报表, 只会在编辑页面中出现, 可以预览 公开 的报表, 如没有分配编辑权限,在编辑页面中不出现, 但在查看页面所有人可见，你可以共享给所有人，访问url: http://xxxxx：8000/echart?type=你的仪表盘名称 手机端过滤, 你可以通过 \u0026ldquo;全端\u0026rdquo;,\u0026ldquo;电脑端\u0026rdquo; 选项实现, 当勾选 \u0026ldquo;全端\u0026rdquo; 时, 手机端电脑端都会显示, 当未勾选 全端, 也不勾选 电脑端时, 只会在 手机显示, 反之只在电脑端显示 "},{"id":61,"href":"/docs/10.%E5%85%B6%E5%AE%83/FAQ/","title":"Faq","section":"10.其它","content":" FAQ # 启动显示 以一种访问权限不允许的方式做了一个访问套接字的尝试 出现这种情况在Windows中很常见，就是端口被占用，酷狗音乐会占用8000端口 使用netstat -ano|findstr 8000 找到进程号 使用taskkill /pid 进程号 /F\n输入命令找不到smartchart 检查你是否有安装多个python环境出现环境变量冲突,请卸载一个或取消一个环境变量\n如法安装pip 请确认在安装python时,有没有加入环境变量, 可自行加入, 或卸载重装\n关于mac版本安装后的各种问题 目前来看最大的可能是，/Library/Developer/CommandLineTools这个目录下有python3，应该是在某一个版本的Xcode command line tools安装时生成的 可以先把python3全部卸载，再重新按说明安装，命令行中输入python3 和 pip3， 找不到command时才说明完全卸载成功\nsudo rm -rf /Library/Developer/CommandLineTools sudo rm -f /usr/bin/python3 如果密码忘记了怎么办 命令行输入smartchart changepassword 你的用户名\n"},{"id":62,"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/","title":"试用激活说明","section":"10.其它","content":"试用专业版激活码需要每3天激活一次,激活方式：\n由于开发很忙, 文档可能会写得有不尽之处, 多多包涵\n"},{"id":63,"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/","title":"Sqlite3版本错误","section":"Linux","content":"SQLite3版本错误 在部分操作系统下（比如CentOS 7）使用SQLite3数据库运行会出现如下的错误提示：\ndjango.core.exceptions.ImproperlyConfigured: SQLite 3.8.3 or later is required (found 3.7.17). 这表明操作系统自带的sqlite3版本过低，需要将系统的sqlite3进行升级。\n以下是一种方法，来自于 StackOverlow：\n1、下载新版本的SQLite3\nwget https://www.sqlite.org/2019/sqlite-autoconf-3290000.tar.gz 2、解压文件\ntar zxvf sqlite-autoconf-3290000.tar.gz 3、进行解压后的目录\ncd sqlite-autoconf-3290000 4、配置安装目录\n./configure --prefix=$HOME/opt/sqlite 5、编译安装\nmake \u0026amp;\u0026amp; make install 6、指定环境变量\nexport PATH=$HOME/opt/sqlite/bin:$PATH export LD_LIBRARY_PATH=$HOME/opt/sqlite/lib export LD_RUN_PATH=$HOME/opt/sqlite/lib 完成之后可以运行sqlite3 \u0026ndash;version 命令来查看当前的SQLite3版本。\n如果还是不行, 报错如下: 可如下方式处理\n# 安装 pip3 install pysqlite3 pip3 install pysqlite3-binary # 编辑django的文件, 路径参考报错 vi xxxxxx/lib/python3.9/site-packages/django/db/backends/sqlite3/base.py # 修改内容 # from sqlite3 import dbapi2 as Database # 注释掉这里 from pysqlite3 import dbapi2 as Database # 然后保存退出就可以了 :wq! "},{"id":64,"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/","title":"生产部署","section":"Linux","content":"购买专业版本，提供企业生产部署及无网离线部署方案\n"},{"id":65,"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/","title":"Elasticsearch数据源","section":"特殊数据源","content":" 数据源配置方法 # 查询方法 # 更多查询方法参考 # 模糊查询 body = { \u0026#39;query\u0026#39;: { # 查询命令 \u0026#39;match\u0026#39;: { # 查询方法：模糊查询（会被分词）。比如此代码，会查到只包含：“我爱你”， “中国”的内容 \u0026#39;name\u0026#39;: \u0026#39;刘\u0026#39; } }, \u0026#39;size\u0026#39;: 20 # 不指定默认是10，最大值不超过10000（可以修改，但是同时会增加数据库压力） } term，精准单值查询 # 注：此方法只能查询一个字段，且只能指定一个值。类似于mysql中的where ziduan=\u0026#39;a\u0026#39; body ={ \u0026#39;query\u0026#39;:{ \u0026#39;term\u0026#39;:{ \u0026#39;ziduan1.keyword\u0026#39;: \u0026#39;刘婵\u0026#39; # 查询内容等于“我爱你中国的”的数据。查询中文，在字段后面需要加上.keyword # \u0026#39;ziduan2\u0026#39;: \u0026#39;liuchan\u0026#39; } } } erms，精准多值查询 #此方法只能查询一个字段，但可以同时指定多个值。类似于mysql中的where ziduan in (a, b,c...) body ={ \u0026#34;query\u0026#34;:{ \u0026#34;terms\u0026#34;:{ \u0026#34;ziduan1.keyword\u0026#34;: [\u0026#34;刘婵\u0026#34;, \u0026#34;赵云\u0026#34;] # 查询ziduan1=\u0026#34;刘婵\u0026#34;或=赵云...的数据 } } } multi_match，多字段查询 # 查询多个字段中都包含指定内容的数据 body = { \u0026#34;query\u0026#34;:{ \u0026#34;multi_match\u0026#34;:{ \u0026#34;query\u0026#34;:\u0026#34;我爱你中国\u0026#34;, # 指定查询内容，注意：会被分词 \u0026#34;fields\u0026#34;:[\u0026#34;ziduan1\u0026#34;, \u0026#34;ziduan2\u0026#34;] # 指定字段 } } } prefix，前缀查询 body = { \u0026#39;query\u0026#39;: { \u0026#39;prefix\u0026#39;: { \u0026#39;ziduan.keyword\u0026#39;: \u0026#39;我爱你\u0026#39; # 查询前缀是指定字符串的数据 } } } # 注：英文不需要加keyword wildcard，通配符查询 body = { \u0026#39;query\u0026#39;: { \u0026#39;wildcard\u0026#39;: { \u0026#39;ziduan1.keyword\u0026#39;: \u0026#39;?刘婵*\u0026#39; # ?代表一个字符，*代表0个或多个字符 } } } # 注：此方法只能查询单一格式的（都是英文字符串，或者都是汉语字符串）。两者混合不能查询出来。 regexp，正则匹配 body = { \u0026#39;query\u0026#39;: { \u0026#39;regexp\u0026#39;: { \u0026#39;ziduan1\u0026#39;: \u0026#39;W[0-9].+\u0026#39; # 使用正则表达式查询 } } } bool，多条件查询 # must：[] 各条件之间是and的关系 body = { \u0026#34;query\u0026#34;:{ \u0026#34;bool\u0026#34;:{ \u0026#39;must\u0026#39;: [{\u0026#34;term\u0026#34;:{\u0026#39;ziduan1.keyword\u0026#39;: \u0026#39;我爱你中国\u0026#39;}}, {\u0026#39;terms\u0026#39;: {\u0026#39;ziduan2\u0026#39;: [\u0026#39;I love\u0026#39;, \u0026#39;China\u0026#39;]}}] } } } # should: [] 各条件之间是or的关系 body = { \u0026#34;query\u0026#34;:{ \u0026#34;bool\u0026#34;:{ \u0026#39;should\u0026#39;: [{\u0026#34;term\u0026#34;:{\u0026#39;ziduan1.keyword\u0026#39;: \u0026#39;我爱你中国\u0026#39;}}, {\u0026#39;terms\u0026#39;: {\u0026#39;ziduan2\u0026#39;: [\u0026#39;I love\u0026#39;, \u0026#39;China\u0026#39;]}}] } } } # must_not：[]各条件都不满足 body = { \u0026#34;query\u0026#34;:{ \u0026#34;bool\u0026#34;:{ \u0026#39;must_not\u0026#39;: [{\u0026#34;term\u0026#34;:{\u0026#39;ziduan1.keyword\u0026#39;: \u0026#39;我爱你中国\u0026#39;}}, {\u0026#39;terms\u0026#39;: {\u0026#39;ziduan2\u0026#39;: [\u0026#39;I love\u0026#39;, \u0026#39;China\u0026#39;]}}] } } } # bool嵌套bool # ziduan1、ziduan2条件必须满足的前提下，ziduan3、ziduan4满足一个即可 body = { \u0026#34;query\u0026#34;:{ \u0026#34;bool\u0026#34;:{ \u0026#34;must\u0026#34;:[{\u0026#34;term\u0026#34;:{\u0026#34;ziduan1\u0026#34;:\u0026#34;China\u0026#34;}}, # 多个条件并列 ，注意：must后面是[{}, {}],[]里面的每个条件外面有个{} {\u0026#34;term\u0026#34;:{\u0026#34;ziduan2.keyword\u0026#34;: \u0026#39;我爱你中国\u0026#39;}}, {\u0026#39;bool\u0026#39;: { \u0026#39;should\u0026#39;: [ {\u0026#39;term\u0026#39;: {\u0026#39;ziduan3\u0026#39;: \u0026#39;Love\u0026#39;}}, {\u0026#39;term\u0026#39;: {\u0026#39;ziduan4\u0026#39;: \u0026#39;Like\u0026#39;}} ] }} ] } } } "},{"id":66,"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/","title":"Jdbc数据源","section":"特殊数据源","content":" 应用场景 # 当无法在python中找到连接库时, 你还可以采用jdbc的连接方式\n使用方法 # 首先您需要安装jdbc的包 pip install JayDeBeApi 在任意的一个仪表盘的 \u0026ldquo;模板\u0026rdquo; 编辑器中, 点击上传资源的图标上传相应的jdbc JAR包即可 新建连接的方式, 以下使用impala为例 "},{"id":67,"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/","title":"Kafka数据源","section":"特殊数据源","content":"用于获取kafka指定分区的最后一条记录, 用于实时场景 使用方法参考\u0026quot;自定义数据源\u0026quot; 以下为参考代码:\ndef dataset(*args, **kwargs): \u0026#34;\u0026#34;\u0026#34; 返回查询数据集 :return: 二维数组或JSON字典 \u0026#34;\u0026#34;\u0026#34; from kafka import KafkaConsumer, TopicPartition import json sqlList = args[0] # 数据集编辑界面的输入已按分号拆分成数组 [sql1, sql2...] config = args[1] # 相关的配置字典{\u0026#39;host\u0026#39;,\u0026#39;port\u0026#39;,\u0026#39;user\u0026#39;,\u0026#39;password\u0026#39;,\u0026#39;db\u0026#39;} # 插入你的数据查询及处理代码, 生成result即可 result = {} consumer = KafkaConsumer(sasl_mechanism=\u0026#39;PLAIN\u0026#39;, security_protocol=\u0026#39;SASL_PLAINTEXT\u0026#39;, sasl_plain_username=config[\u0026#39;user\u0026#39;], sasl_plain_password=config[\u0026#39;password\u0026#39;], bootstrap_servers=config[\u0026#39;host\u0026#39;], auto_offset_reset=\u0026#39;earliest\u0026#39;, api_version=(1, 0, 0), consumer_timeout_ms=50, value_deserializer=lambda v: json.loads(v.decode(\u0026#39;utf-8\u0026#39;)), ) topic = sqlList[0] partition = int(config[\u0026#39;db\u0026#39;]) tp = TopicPartition(topic=topic, partition=partition) consumer.assign([tp]) end_offsets = consumer.end_offsets([tp]).get(tp) # 获取当前消费者最大偏移量 consumer.seek(tp, offset=end_offsets-1) for message in consumer: result = message.value break return result def insert_dataset(*args, **kwargs): \u0026#34;\u0026#34;\u0026#34; 数据填报实现 \u0026#34;\u0026#34;\u0026#34; from kafka import KafkaProducer import json contents = args[0] # 传入的数据集二维数组格式 table = args[1] # 配置中的表名 config = args[3] # 相关的配置字典{\u0026#39;host\u0026#39;,\u0026#39;port\u0026#39;,\u0026#39;user\u0026#39;,\u0026#39;password\u0026#39;,\u0026#39;db\u0026#39;} # 插入你的写入数据逻辑代码 producer = KafkaProducer(sasl_mechanism=\u0026#39;PLAIN\u0026#39;, security_protocol=\u0026#39;SASL_PLAINTEXT\u0026#39;, sasl_plain_username=config[\u0026#39;user\u0026#39;], sasl_plain_password=config[\u0026#39;password\u0026#39;], bootstrap_servers=config[\u0026#39;host\u0026#39;], value_serializer=lambda v: json.dumps(v).encode(\u0026#39;utf-8\u0026#39;) ) producer.send(table, value=contents, partition=int(config[\u0026#39;db\u0026#39;])) "},{"id":68,"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/","title":"Mongodb数据源","section":"特殊数据源","content":" 使用方法 # 连接池正常配置即可 数据集开发中，填写查询需求： {\u0026#34;db\u0026#34;: \u0026#34;db1\u0026#34;, \u0026#34;table\u0026#34;: \u0026#34;tb1\u0026#34;, \u0026#34;filter\u0026#34;: {\u0026#34;name\u0026#34;: \u0026#34;Zarten\u0026#34;}, \u0026#34;projection\u0026#34;: {\u0026#34;_id\u0026#34;: 0}, \u0026#34;sort\u0026#34;: [[\u0026#34;_id\u0026#34;, 1]], \u0026#34;limit\u0026#34;: 10} 由于返回的字典格式， 如需转化成二维数组， 可使图形中的转化函数ds_mapToList\nlet dataset=ds_mapToList(__dataset__); 参数说明： # 除table，其它都为可选参数\n参数 说明 样列 db 数库名,默认连接设定中db名 table 表名[必填] filter 筛选项,具体用法参考下文 {\u0026ldquo;name\u0026rdquo;: \u0026ldquo;Zarten\u0026rdquo;,\u0026ldquo;date\u0026rdquo;:\u0026ldquo;2020-10-01\u0026rdquo;} projection 显示列 {\u0026ldquo;name\u0026rdquo;: 1,\u0026ldquo;date\u0026rdquo;:1} sort 排序，-1为降序 [[\u0026ldquo;date\u0026rdquo;, -1]] limit 限定返回数量 filter条件说明 # 且条件\n{\u0026#34;age\u0026#34;:{\u0026#34;$gt\u0026#34;:22}, \u0026#34;name\u0026#34;:{\u0026#34;$regex\u0026#34;:\u0026#34;user\u0026#34;}} 或条件\n{ \u0026#34;$or\u0026#34;: [ {\u0026#34;age\u0026#34;: {\u0026#34;$gt\u0026#34;: 22}}, {\u0026#34;name\u0026#34;: {\u0026#34;$regex\u0026#34;: \u0026#34;user\u0026#34;}} ] } 比较查询 $lt和\u0026lt;，$lte和\u0026lt;=，$gt和\u0026gt;，gte和\u0026gt;=，ne和!=是一一对应的\n{\u0026#34;field_name\u0026#34;: {\u0026#34;$lt\u0026#34;: value, \u0026#34;$gt\u0026#34;: value}} 关联查询$in和$nin\n{\u0026#34;field_name\u0026#34;: {\u0026#34;$in\u0026#34;: [1,5,8]}} $regex为模糊查询的字符串提供正则表达式功能\n{\u0026#34;$or\u0026#34;: [{\u0026#34;field_name\u0026#34;: {\u0026#39;$regex\u0026#39;: value}},{\u0026#34;field_name2\u0026#34;: {\u0026#34;$regex\u0026#34;: value}}]} "},{"id":69,"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/","title":"Promitheus数据源","section":"特殊数据源","content":" 数据源配置方法 # 驱动: prometheus 连接地址: http://ip:9090\n查询方法 # 输入常规查询命令即可 返回值为prometheus标准json, 你需要在图形编辑器中使用js处理数据\nlet dataset=__dataset__; //获取返回值列表中的第一值 dataset = dataset.data.result[0].value; print(dataset) 处理数据样列 # 如获得的数据\n{ \u0026#34;status\u0026#34;:\u0026#34;success\u0026#34;, \u0026#34;data\u0026#34;:{ \u0026#34;resultType\u0026#34;:\u0026#34;vector\u0026#34;, \u0026#34;result\u0026#34;:[ {\u0026#34;metric\u0026#34;:{\u0026#34;__name__\u0026#34;:\u0026#34;starrocks_fe_routine_load_jobs\u0026#34;,\u0026#34;group\u0026#34;:\u0026#34;fe\u0026#34;,\u0026#34;instance\u0026#34;:\u0026#34;xxx:8030\u0026#34;,\u0026#34;job\u0026#34;:\u0026#34;StarRocks_Cluster01\u0026#34;,\u0026#34;state\u0026#34;:\u0026#34;CANCELLED\u0026#34;}, \u0026#34;value\u0026#34;:[1671188429.573,\u0026#34;0\u0026#34;] }, {\u0026#34;metric\u0026#34;:{\u0026#34;__name__\u0026#34;:\u0026#34;starrocks_fe_routine_load_jobs\u0026#34;,\u0026#34;group\u0026#34;:\u0026#34;fe\u0026#34;,\u0026#34;instance\u0026#34;:\u0026#34;xxx:8030\u0026#34;,\u0026#34;job\u0026#34;:\u0026#34;StarRocks_Cluster01\u0026#34;,\u0026#34;state\u0026#34;:\u0026#34;NEED_SCHEDULE\u0026#34;}, \u0026#34;value\u0026#34;:[1671188429.573,\u0026#34;2\u0026#34;]} ... ] } } 图形中处理成smartchart标准格式\n//处理prometheus let df = __dataset__; let result = df.data.result; let dataset = [[\u0026#39;instance\u0026#39;,\u0026#39;state\u0026#39;,\u0026#39;qty\u0026#39;]]; //二维表头 for(let item of result){ let pmetric = item.metric; let pvalue = item.value; dataset.push([pmetric.instance,pmetric.state,pvalue[1]]); } dataset = ds_pivot(dataset); //列转行 如果带时序的, 数据处理参考\nlet df = __dataset__; let result = df.data.result; let dataset = [[\u0026#39;instance\u0026#39;,\u0026#39;seq\u0026#39;,\u0026#39;qty\u0026#39;]]; //二维表头 for(let item of result){ let pmetric = item.metric; let pvalues = item.values; let startv = pvalues[0][1]; //初始值 for(let i=1; i\u0026lt;pvalues.length; i++){ let pvalue = pvalues[i]; dataset.push([i,pmetric.instance,pvalue[1]-startv]); //计算增长值 } } dataset = ds_pivot(dataset); //列转行 你可能会用上的时间戳转文本格式\nfunction getLocalTime(nS) { return new Date(nS * 1000).toLocaleString(); } 支持多段查询 # 使用分号(;)分隔查询 "},{"id":70,"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/","title":"Redis数据源","section":"特殊数据源","content":" 应用场景 # 你可能会有这样的一些需求, 展示数据是要通过外部的程序计算好,如一些实时的计算场景,用spark计算好的数据 或爬虫爬取的数据, 然后写入redis或nosql的数据库,最后由前端图形直接展示或数据下载,SmartChart支持这一块的应用\n使用方法 # 你可以创建一个redis的连接池, 然后按照通用的方法建立数据集 不同的是, 数据集的SQL区不再是写sql代码, 而只需要写redis中的keyname\n如redis中存储的数据是keyname 为 \u0026ldquo;指标A\u0026rdquo;, 数据 \u0026lsquo;{\u0026ldquo;长沙\u0026rdquo;:1,\u0026ldquo;上海\u0026rdquo;:2}\u0026rsquo; 这样我们只需要在数据集中写上\n指标A 即可, 最后你会得到{\u0026ldquo;长沙\u0026rdquo;:1,\u0026ldquo;上海\u0026rdquo;:2}的返回结果\n如果你需要的是表格格式, 那么你只需要往redis中存入一个二维数组, 比如: [[\u0026ldquo;省份\u0026rdquo;,\u0026ldquo;数量\u0026rdquo;],[\u0026ldquo;长沙\u0026rdquo;,1],[\u0026ldquo;上海\u0026rdquo;,2]]\n注意数据存入redis为字符串格式,你可使用python的json.dumps来生成字符串格式存入\n当然我们也支持同一个数据中获取多个keyname # 比如还有一个\u0026quot;指标B\u0026quot;, 数据是'12345' 我们可以同时写上两个指标,用分号隔开:\n指标A;指标B 最后你会得到的结果是: { \u0026ldquo;指标A\u0026rdquo;:{\u0026ldquo;长沙\u0026rdquo;:1,\u0026ldquo;上海\u0026rdquo;:2}, \u0026ldquo;指标B\u0026rdquo;:12345 }\n"},{"id":71,"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/","title":"Sqlalchemy连接","section":"特殊数据源","content":"常规的连接池的设定, 大家应该都很清楚了, Smartchart也支持sqlalchemy连接, 对于一些smartchart不支持的数据源可以使用此方法 配置方法: 只用填以上内容, 其它可留空 连接地址的写法参考sqlalchemy说明:\n可选参数。一个标准的链接URL是这样的： dialect+driver://username:password@host:port/database dialect，是数据库类型，大概包括：sqlite, mysql, postgresql, oracle, or mssql. driver，是使用的数据库API，驱动，连接包，随便叫什么吧。 username，用户名 password，密码 host，网络地址，可以用ip，域名，计算机名，当然是你能访问到的。 port，数据库端口。 databas，数据库名。 其实这些也就dialect和dirver需要解释。 二：连接sqlite3 1，驱动 sqlite3是个文件数据库，不需要什么驱动，或者说python内置了驱动。 2，标准连接参数 # sqlite://\u0026lt;nohostname\u0026gt;/\u0026lt;path\u0026gt; 没有hostname 3，各种链接参数 # 相对路径，就是这个python文件同目录下foo.db engine = create_engine(\u0026#39;sqlite:///foo.db\u0026#39;) #绝对路径 #Unix/Mac下用四条////表示 engine = create_engine(\u0026#39;sqlite:////absolute/path/to/foo.db\u0026#39;) #Windows下用三条///加盘符路径用两条\\\\ engine = create_engine(\u0026#39;sqlite:///C:\\\\path\\\\to\\\\foo.db\u0026#39;) #Windows 也可以这么用三条///加盘符路径用一条\\ engine = create_engine(r\u0026#39;sqlite:///C:\\path\\to\\foo.db\u0026#39;) #数据库建在内存里。URI保持为空即可 engine = create_engine(\u0026#39;sqlite://\u0026#39;) 三：连接mysql（mariadb） sqlalchemy默认使用mysql-python作为链接驱动，既default模式 选哪种驱动，就装哪个包。 1，default默认链接方式 engine = create_engine(\u0026#39;mysql://scott:tiger@localhost/foo\u0026#39;) 2，# mysql-python，声明使用mysql-python驱动 engine = create_engine(\u0026#39;mysql+mysqldb://scott:tiger@localhost/foo\u0026#39;) 3，MySQL-connector-python 声明使用MySQL-connector-python驱动（推荐使用） engine = create_engine(\u0026#39;mysql+mysqlconnector://scott:tiger@localhost/foo\u0026#39;) 4，OurSQL 声明使用OurSQL驱动 engine = create_engine(\u0026#39;mysql+oursql://scott:tiger@localhost/foo\u0026#39;) 四：连接Microsoft SQL Server sqlalchemy默认使用 pyodbc作为链接驱动。 1，pyodbc engine = create_engine(\u0026#39;mssql+pyodbc://scott:tiger@mydsn\u0026#39;) 2，pymssql engine = create_engine(\u0026#39;mssql+pymssql://scott:tiger@hostname:port/dbname\u0026#39;) 五：连接PostgreSQL PostgreSQL默认使用 psycopg2作为链接驱动，既default模式 1， default engine = create_engine(\u0026#39;postgresql://scott:tiger@localhost/mydatabase\u0026#39;) 2，psycopg2 engine = create_engine(\u0026#39;postgresql+psycopg2://scott:tiger@localhost/mydatabase\u0026#39;) 3， pg8000 engine = create_engine(\u0026#39;postgresql+pg8000://scott:tiger@localhost/mydatabase\u0026#39;) 六：连接Oracle Oracle可能只有 cx_oracle一个驱动包，既default模式和声明模式一样。 1，default engine = create_engine(\u0026#39;oracle://scott:tiger@127.0.0.1:1521/sidname\u0026#39;) 2，cx_oracle engine = create_engine(\u0026#39;oracle+cx_oracle://scott:tiger@tnsname\u0026#39;) "},{"id":72,"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/","title":"带分页的表格","section":"Element Ui组件","content":" 模式开启 # 需要开启模板开发模式, 并开启basevue模板 在Body加入组件 # \u0026lt;!--表格--\u0026gt; \u0026lt;div class=\u0026#34;smtdrag\u0026#34; id=\u0026#34;id_1654907858638\u0026#34;\u0026gt; \u0026lt;el-table :data=\u0026#34;tableData.slice((currentPage-1)*pageSize, currentPage*pageSize)\u0026#34; height=\u0026#34;100%\u0026#34; size=\u0026#34;mini\u0026#34; header-cell-class-name=\u0026#34;tablehead\u0026#34; border style=\u0026#34;width: 100%\u0026#34;\u0026gt; \u0026lt;el-table-column v-for=\u0026#34;item in tableHead\u0026#34; :label=\u0026#34;item.label\u0026#34; :property=\u0026#34;item.prop\u0026#34; sortable\u0026gt; \u0026lt;/el-table-column\u0026gt; \u0026lt;/el-table\u0026gt; \u0026lt;!--表格结束--\u0026gt; \u0026lt;!--分页控件--\u0026gt; \u0026lt;el-pagination align=\u0026#39;center\u0026#39; @size-change=\u0026#34;handlerSizeChange\u0026#34; @current-change=\u0026#34;handlerCurrentChange\u0026#34; :current-page=\u0026#34;currentPage\u0026#34; :page-size=\u0026#34;pageSize\u0026#34; layout=\u0026#34;total,sizes,prev,pager,next,jumper\u0026#34; :total=\u0026#34;tableData.length\u0026#34; \u0026gt;\u0026lt;/el-pagination\u0026gt; \u0026lt;!--分页控件结束--\u0026gt; \u0026lt;/div\u0026gt; 在JS区域加入 # var vapp = new Vue({el: \u0026#39;#vue_app\u0026#39;, delimiters: [\u0026#39;{[\u0026#39;, \u0026#39;]}\u0026#39;], data: { tableData:[], //表数据 tableHead:[], //表头 currentPage:1, total:20, pageSize:10 }, methods: { //处理分页数量 handlerSizeChange(val){ this.currentPage = 1; this.pageSize=val; }, //处理页选择 handlerCurrentChange(val){ this.currentPage = val; } } }); 新增一个数据集(拖拽图形) # 在数据集编辑器中写入查询\nselect * from smartdemo2 limit /* $limit -- */ 100 图形开发中修改 # let df0 = __dataset__; //处理表头 let columnsDict = {\u0026#39;c1\u0026#39;:\u0026#39;渠道\u0026#39;,\u0026#39;qty\u0026#39;:\u0026#39;数量\u0026#39;}; let tableHead = []; let tableHeadLabel; for (let i=0;i\u0026lt;df0[0].length;i++){ if(columnsDict.hasOwnProperty(df0[0][i])){ df0[0][i] = columnsDict[df0[0][i]] } tableHeadLabel=df0[0][i]; tableHead.push({label: tableHeadLabel, prop:df0[0][i]}); } //VUE赋值 vapp.tableHead = tableHead; vapp.tableData=ds_createMap_all(df0); smartchart内置了这个查询模板, 你可以通过 本地模板恢复快速应用\n"},{"id":73,"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/","title":"Line Up图形","section":"特殊图形","content":"Smartchart内置了LineUp图形 LineUp is an interactive technique designed to create, visualize and explore rankings of items based on a set of heterogeneous attributes. LineUp图形参考\nds_loadcss(\u0026#39;smt_LineUp\u0026#39;); ds_loadjs(\u0026#39;smt_LineUp\u0026#39;); let dataset = __dataset__; dataset = ds_createMap_all(dataset); try{Ljs__name__.destroy()}catch{} Ljs__name__ = LineUpJS.asTaggle(dom__name__, dataset); // 点击选中行响应动作 Ljs__name__.on(LineUpJS.LineUp.EVENT_SELECTION_CHANGED, (selection) =\u0026gt; { console.log(Ljs__name__.data._data[selection]); //通过以上log可以查看到数据格式， 以下就是标准的联动写法 filter_param[\u0026#39;LineupParam\u0026#39;] = Ljs__name__.data._data[selection].xx ds_refresh(2); }); //更多响应动作 Ljs__name__.on(LineUpJS.LineUp.EVENT_HIGHLIGHT_CHANGED, (highlight) =\u0026gt; { }); // document.querySelector(\u0026#39;button#select\u0026#39;).addEventListener(\u0026#39;click\u0026#39;, () =\u0026gt; { // Ljs__name__.setSelection([1, 2, 3]); // }); // document.querySelector(\u0026#39;button#highlight\u0026#39;).addEventListener(\u0026#39;click\u0026#39;, () =\u0026gt; { // Ljs__name__.setHighlight(50); // }); // 获取筛选后的数据并下载(来源于\u0026#34;路阳\u0026#34; 赞助开发) outputStr=Ljs__name__.data.exportTable(Ljs__name__.data.getRankings()[0], {}); outputStr = outputStr.replace(/\\t/g, \u0026#39;,\u0026#39;); ds_download(\u0026#39;abc.csv\u0026#39;, outputStr); "},{"id":74,"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/","title":"使用图标","section":"特殊图形","content":"在\u0026quot;模板\u0026quot;中加载图标资源 使用方法, 可参考 font-awesome菜鸟教程 V5图标名称参考, 也可以 图标样列查询 "},{"id":75,"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/","title":"无缝滚动","section":"特殊图形","content":" 通用滚动 # 例如你的html如下\n\u0026lt;div id=\u0026#34;smtid\u0026#34; style=\u0026#34;height:100%\u0026#34;\u0026gt; \u0026lt;ul\u0026gt; \u0026lt;li\u0026gt;smartchart\u0026lt;/li\u0026gt; \u0026lt;li\u0026gt;bigdata\u0026lt;/li\u0026gt; \u0026lt;li\u0026gt;echarts\u0026lt;/li\u0026gt; \u0026lt;li\u0026gt;make it great\u0026lt;/li\u0026gt; \u0026lt;/ul\u0026gt; \u0026lt;/div\u0026gt; 你只需要在图形中使用以下函数, 即可实现在无缝滚动\n//smtid是滚动容器的ID ds_liMarquee(\u0026#39;#smtid\u0026#39;) //如果 class=\u0026#34;smtclass\u0026#34;, 那么也可以使用类选择器 ds_liMarquee(\u0026#39;.smtclass\u0026#39;) 我们也可以使用更多的配置方法\nmarconfig={ playtime: 3000, //滚动3秒 pausetime: 3000, //停3秒 config:{ direction: \u0026#39;up\u0026#39;,//向上滚动 runshort: false,//内容不足时不滚动 scrollamount: 20//速度 } } //传入自定义配置 ds_liMarquee(\u0026#39;#smtid\u0026#39;, marconfig) 更多config说明:\n名称 类型 默认值 说明 direction 字符串 left 滚动方向，可选 left / right / up / down loop 整数 -1 循环次数，-1 为无限循环 scrolldelay 整数 0 每次重复之前的延迟 scrollamount 整数 50 滚动速度，越大越快 circular 布尔值 true 无缝滚动，如果为 false，则和 marquee 效果一样 drag 布尔值 true 鼠标可拖动 runshort 布尔值 true 内容不足是否滚动 hoverstop 布尔值 true 鼠标悬停暂停 xml 布尔值 false 加载xml 文件 inverthover 布尔值 false 反向，即默认不滚动，鼠标悬停滚动 内置滚动表格 # smartchart内置了滚动表格, 可以一键生成\n样式自定义 # 如需修改表格的样式, 如字体,颜色等, 可以在模板中重定义样式 具体样式写法, 参考 样式快速入门\n/*表头样式*/ .smtlisthead{ background: #fff2cc; color: red; height: 5rem; } .smtlisthead span{ height: 5rem; } /*表格本体样式*/ .smtlistnav{ height: calc(100% - 5rem); color: red; overflow: auto; } .smtlistnav li span{ height: 3rem; } /*修改奇数行背景,偶数行将odd改为even*/ .smtlistnav ul li:nth-child(odd){ background: rgba(100,100,100,.1);} 指定某单元格宽度对齐 # \u0026lt;span\u0026gt; \u0026lt;span style=\u0026#34;width:32rem;height:100%;flex-shrink:0;justify-content:left\u0026#34;\u0026gt;\u0026lt;span\u0026gt; \u0026lt;/span\u0026gt; 单元格点击响应 # let lastClickDom; let lastDomColor; $(\u0026#39;#smtlist__name__, li\u0026#39;).click(function(params){ try{lastClickDom.css(\u0026#39;background\u0026#39;, lastDomColor)}catch{} lastDomColor = $(this).css(\u0026#39;background\u0026#39;); $(this).css(\u0026#39;background\u0026#39;, \u0026#39;yellow\u0026#39;); lastClickDom = $(this); let myparam = $(this).children(\u0026#39;span\u0026#39;).eq(0).text(); //获取点击的参数 //以下加入你的action }); "},{"id":76,"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/","title":"特殊图形加载","section":"特殊图形","content":"smartchart默认只会引echarts的基础图形, 如需使用更多图形,可在模板javascript标签中自行引用\n中国地图 \u0026lt;script src=\u0026#34;/static/smartchart/opt/smt_china.js\u0026#34;\u0026gt;\u0026lt;/script\u0026gt; 世界地图 \u0026lt;script src=\u0026#34;/static/smartchart/opt/smt_world.js\u0026#34;\u0026gt;\u0026lt;/script\u0026gt; 统计图 \u0026lt;script src=\u0026#34;/static/smartchart/opt/smt_ecStat.js\u0026#34;\u0026gt;\u0026lt;/script\u0026gt; 水球图 \u0026lt;script src=\u0026#34;/static/smartchart/opt/smt_liquidfill.js\u0026#34;\u0026gt;\u0026lt;/script\u0026gt; 词云 \u0026lt;script src=\u0026#34;/static/smartchart/opt/smt_wordcloud.js\u0026#34;\u0026gt;\u0026lt;/script\u0026gt; 百度地图 \u0026lt;script type=\u0026#34;text/javascript\u0026#34; src=\u0026#34;https://fastly.jsdelivr.net/npm/echarts@5/dist/extension/bmap.min.js\u0026#34;\u0026gt;\u0026lt;/script\u0026gt; "},{"id":77,"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/","title":"Jupyter中使用指引","section":"9. Jupyter应用","content":" 应用场景 # 你需要在jupyter中通过smartchart分享的数据集获取数据进行分析 你有很多线下数据需要进行个性化分析, 然后制做仪表盘 在Jupyter的数据分析过程中, 你需要快速生成图形 大屏或报表有部分数据集是需要能过复杂的分析生成的\nSmartchart支持像pyecharts, Matplotlib 等python绘图工具一样在Jupyter中使用, 但她更加方便, 更加炫酷 和 通用化, 不仅仅是一个绘图工具, 而且是一个平台\n我们有什么特色:\n使用上手非常简单, 仅仅只有两个命令, get and set, 配置项采用原生的Echarts配置, 无重复学习成本, 使用顺滑 支持Echarts所有功能, 可定制化程度高, 显示效果好, 可嵌入也可以弹出窗口显示, 也可以dashboard中显示 数据可以固化存储, 采用smartchart Portal可以直接拼接炫酷大屏\nSmartchart与Pandas Smartchart与Jupyter SmartChart大屏新思路\n安装使用方法 # 你需要在jupyter相同的python环境中安装smartchart客户端 pip install smartchart 或pip3 install -i https://pypi.tuna.tsinghua.edu.cn/simple smartchart 如果你只是需要连接已部署好的smartchart服务端, 本地无需启动smartchart 快速开始 # 初始化认证: 第一次使用时, 打开jupyter后, 需要设定默认用户和smartchart服务端url 同一个环境, 只需初始化一次, 后面无需再设定\nfrom smart_chart import Smart Smart().set_auth(\u0026#39;用户名\u0026#39;, \u0026#39;密码\u0026#39;,url = \u0026#39;http://xxxxx\u0026#39;) 如果smartchart服务端在本地, 可以省略url\nSmart().set_auth(\u0026#39;用户名\u0026#39;, \u0026#39;密码\u0026#39;) 使用方法:\nfrom smart_chart import Smart mysmart = Smart() dataset = [[\u0026#39;A\u0026#39;,\u0026#39;B\u0026#39;,\u0026#39;C\u0026#39;],[12,34,23],[22,33,37]] #把数据写入临时数据集并显示图形 mysmart.set(1,dataset) #随意命名临时数据集, 不一定需要smartchart中数据集已有的 mysmart.set(\u0026#39;DD\u0026#39;, dataset) #从已有的数据集中获取数据(格式参考smartchart数据集) ds1 = mysmart.get(1) ds2 = mysmart.get(\u0026#39;DD\u0026#39;) 修改图形显示 # 方法一: 你可以在图形菜单中选择内置图形或主题 方法二: set默认是表格显示,你也可通过名称加前缀 bar, line, pie进行修改\nmysmart.set(\u0026#39;barxxx\u0026#39;, dataset) #显示柱形图, 另外还有linexxx, piexxx 方法三: 简单图形,可能无法满足你的个性化要求, 你可以采用实例化数据集的方式后做出炫酷的自定义图形\nmysmart.set(\u0026#39;myds_1\u0026#39;, dataset, push=1) #参数push=1, 将实例化数据集 实例化的数据集, 在图形编辑区点击, 可以进入定制化图形开发, 可使用原生的Echarts配置和实时调试,或直接使用社区图形(第一次使用,有一个登记的过程, 按提示进行) 方法四: 如何在非实例化的数据集中使用自定义图形进行临时显示 假如你已经实例化并自定义了图形, 比如 \u0026lsquo;myds_1\u0026rsquo;, 你可以直接用它的名称来set\n#不加push, 将使用新的数据采用myds_1的图形临时显示, 而不会改变原myds_1的数据 mysmart.set(\u0026#39;myds_1\u0026#39;, dataset) 显示设定参数 # 你可以通过参数来设定图形的高宽, 是否嵌入等个性化要求\n# width, height指定图形嵌入显示的宽高 # embed 默认不嵌入, embed=1 嵌入, embed=0 不嵌入 # editor 是否显示图形菜单, 1显示, 0不显示 # push 是否持久化数据集 push=1, 无则新建有则保存数据 # url 报表访问的url,默认是localhost #可以全局初始化设定 mysmart = Smart(width=xx, height=xx, embed=1, editor=\u0026#39;\u0026#39;) #也可以全局单独进行设定 mysmart.url = \u0026#39;http://ip:8000\u0026#39; mysmart.embed = 1 #也可以针对单独的一个图形设定 mysmart.set(1,dataset,embed=1,height=200,editor=0) SmartChart与Pandas # Smartchart的set支持直接set Pandas的dataframe对象\nfrom smart_chart import Smart import pandas as pd mysmart = Smart() df = pd.read_excel(\u0026#39;manual_smartdemo.xlsx\u0026#39;, \u0026#39;sheet1\u0026#39;) mysmart.set(\u0026#39;excelsample\u0026#39;, df.sample(10)) df1 = df.groupby(\u0026#39;province\u0026#39;).agg({\u0026#39;qty\u0026#39;:\u0026#39;sum\u0026#39;}).reset_index() mysmart.set(\u0026#39;ec_df1\u0026#39;, df1, push=1) df2 = df.groupby(\u0026#39;c1\u0026#39;).agg({\u0026#39;qty\u0026#39;:\u0026#39;sum\u0026#39;}).reset_index() mysmart.set(\u0026#39;ec_df2\u0026#39;, df2, push=1) df4 = df.groupby(\u0026#39;province\u0026#39;).agg({\u0026#39;qty\u0026#39;:\u0026#39;count\u0026#39;}).reset_index() mysmart.set(\u0026#39;ec_df4\u0026#39;, df1, push=1) df3 = df.groupby(\u0026#39;c3\u0026#39;).agg({\u0026#39;qty\u0026#39;:\u0026#39;sum\u0026#39;}).reset_index() print(df3) df3.loc[1, \u0026#39;qty\u0026#39;] = df3.loc[1, \u0026#39;qty\u0026#39;] * 100 print(df3) mysmart.set(\u0026#39;ec_df3\u0026#39;, df3, push=1) #mysmart.set(\u0026#39;pie0\u0026#39;, df1) #df2 = df.groupby([\u0026#39;province\u0026#39;,\u0026#39;c3\u0026#39;]).agg({\u0026#39;qty\u0026#39;:\u0026#39;sum\u0026#39;}).reset_index() #print(df2) #mysmart.set(\u0026#39;ssss\u0026#39;, df2) #print(mysmart.get(15)) "}]
\ No newline at end of file
diff --git a/docs/en.search.min.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js b/docs/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js
similarity index 90%
rename from docs/en.search.min.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js
rename to docs/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js
index 08bd69e..1ed03af 100644
--- a/docs/en.search.min.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js
+++ b/docs/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js
@@ -1 +1 @@
-"use strict";(function(){const o="/en.search-data.min.76743e701847269b6e3a92d8a5dc29d64a2bd8b29421c692138c3702977e76b3.json",i=Object.assign({cache:!0},{doc:{id:"id",field:["title","content"],store:["title","href","section"]}}),e=document.querySelector("#book-search-input"),t=document.querySelector("#book-search-results");if(!e)return;e.addEventListener("focus",n),e.addEventListener("keyup",s),document.addEventListener("keypress",a);function a(t){if(t.target.value!==void 0)return;if(e===document.activeElement)return;const n=String.fromCharCode(t.charCode);if(!r(n))return;e.focus(),t.preventDefault()}function r(t){const n=e.getAttribute("data-hotkeys")||"";return n.indexOf(t)>=0}function n(){e.removeEventListener("focus",n),e.required=!0,fetch(o).then(e=>e.json()).then(e=>{window.bookSearchIndex=FlexSearch.create("balance",i),window.bookSearchIndex.add(e)}).then(()=>e.required=!1).then(s)}function s(){for(;t.firstChild;)t.removeChild(t.firstChild);if(!e.value)return;const n=window.bookSearchIndex.search(e.value,10);n.forEach(function(e){const n=c("<li><a href></a><small></small></li>"),s=n.querySelector("a"),o=n.querySelector("small");s.href=e.href,s.textContent=e.title,o.textContent=e.section,t.appendChild(n)})}function c(e){const t=document.createElement("div");return t.innerHTML=e,t.firstChild}})()
\ No newline at end of file
+"use strict";(function(){const o="/en.search-data.min.3cafa0b94e37157671ea76c2a8be4e6acaccc22ec5373b70cf48ca13d81d32ca.json",i=Object.assign({cache:!0},{doc:{id:"id",field:["title","content"],store:["title","href","section"]}}),e=document.querySelector("#book-search-input"),t=document.querySelector("#book-search-results");if(!e)return;e.addEventListener("focus",n),e.addEventListener("keyup",s),document.addEventListener("keypress",a);function a(t){if(t.target.value!==void 0)return;if(e===document.activeElement)return;const n=String.fromCharCode(t.charCode);if(!r(n))return;e.focus(),t.preventDefault()}function r(t){const n=e.getAttribute("data-hotkeys")||"";return n.indexOf(t)>=0}function n(){e.removeEventListener("focus",n),e.required=!0,fetch(o).then(e=>e.json()).then(e=>{window.bookSearchIndex=FlexSearch.create("balance",i),window.bookSearchIndex.add(e)}).then(()=>e.required=!1).then(s)}function s(){for(;t.firstChild;)t.removeChild(t.firstChild);if(!e.value)return;const n=window.bookSearchIndex.search(e.value,10);n.forEach(function(e){const n=c("<li><a href></a><small></small></li>"),s=n.querySelector("a"),o=n.querySelector("small");s.href=e.href,s.textContent=e.title,o.textContent=e.section,t.appendChild(n)})}function c(e){const t=document.createElement("div");return t.innerHTML=e,t.firstChild}})()
\ No newline at end of file
diff --git a/docs/index.html b/docs/index.html
index 6f7af5a..2da34f8 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -16,7 +16,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <link rel="alternate" type="application/rss+xml" href="https://help.smartchart.cn/index.xml" title="Smartchart开发手册" />
diff --git a/docs/index.xml b/docs/index.xml
index 9831e1b..101f512 100644
--- a/docs/index.xml
+++ b/docs/index.xml
@@ -51,9 +51,11 @@ Smartchart数据集与图形 从仪表盘界面中进入简易开发界面 # </d
       <pubDate>Mon, 01 Jan 0001 00:00:00 +0000</pubDate>
       
       <guid>https://help.smartchart.cn/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/</guid>
-      <description>对接外部API取数, 注意返回一定要是JSON格式 你只需要在数据集编辑框中如下输入
-//GET 方法: dataset= { &amp;#34;url&amp;#34;:&amp;#34;https://www.smartchart.cn/smartdata/api/?i=loaddataset1&amp;amp;j=1&amp;#34; } //POST 方法: dataset= { &amp;#34;url&amp;#34;:&amp;#34;https://www.smartchart.cn/smartdata/api&amp;#34;, &amp;#34;method&amp;#34;:&amp;#34;POST&amp;#34;, &amp;#34;data&amp;#34;:{&amp;#34;i&amp;#34;:&amp;#34;loaddataset1&amp;#34;, &amp;#34;j&amp;#34;:&amp;#34;1&amp;#34;} ... } 例如你可以传入参数做出联动效果
-dataset= { &amp;#34;url&amp;#34;:&amp;#34;https://www.smartchart.cn/smartdata/api&amp;#34;, &amp;#34;method&amp;#34;:&amp;#34;POST&amp;#34;, &amp;#34;data&amp;#34;:{&amp;#34;i&amp;#34;:&amp;#34;loaddataset1&amp;#34;, &amp;#34;j&amp;#34;:&amp;#34;/*$参数名*/&amp;#34;} ... } 你也可以增加header等认证方式
+      <description> API接口要求 # 接口返回一定要是JSON格式
+数据源配置方法 # 你可选择任意数据连接
+使用方法 # 以下是简单的get及post方法样列
+//GET 方法: dataset= { &amp;#34;url&amp;#34;:&amp;#34;https://www.smartchart.cn/smartdata/api/?i=loaddataset1&amp;amp;j=1&amp;#34; } //POST 方法: dataset= { &amp;#34;url&amp;#34;:&amp;#34;https://www.smartchart.cn/smartdata/api&amp;#34;, &amp;#34;method&amp;#34;:&amp;#34;POST&amp;#34;, &amp;#34;data&amp;#34;:{&amp;#34;i&amp;#34;:&amp;#34;loaddataset1&amp;#34;, &amp;#34;j&amp;#34;:&amp;#34;1&amp;#34;} ... } 可以传入参数做出联动效果
+dataset= { &amp;#34;url&amp;#34;:&amp;#34;https://www.smartchart.cn/smartdata/api&amp;#34;, &amp;#34;method&amp;#34;:&amp;#34;POST&amp;#34;, &amp;#34;data&amp;#34;:{&amp;#34;i&amp;#34;:&amp;#34;loaddataset1&amp;#34;, &amp;#34;j&amp;#34;:&amp;#34;/*$参数名*/&amp;#34;} ... } 可以增加header等认证方式
 dataset= { &amp;#34;url&amp;#34;:&amp;#34;https://www.smartchart.cn/smartdata/api&amp;#34;, &amp;#34;method&amp;#34;:&amp;#34;GET&amp;#34;, &amp;#34;headers&amp;#34;:{&amp;#34;Cookie&amp;#34;:&amp;#34;xxxxxxx&amp;#34;} ... } </description>
     </item>
     
@@ -262,7 +264,7 @@ parent() 获取元素的直接父元素 $(&amp;#34;span&amp;#34;).parent().css({
 常规方法 # 比如你需要点击0号图形, 指定其它图形联动 你只需要打开0号图形的数据集编辑页面, 点击标题的位置 然后输入相关的参数即可, 以下为sample 参数值设定的方法, 你可以先留空, 然后保存, F12打开浏览器调试方法 点击0号图形你需要点击的动作, 你可以在调试窗口的console看到输入的log 比如我们需要传递的参数值是&amp;quot;廉颇&amp;quot;, 那么取数据的方法就是data.name, 你把这个填入即可 这样就实现按所选数据或所选系列钻取/联动了, 重新点击当前所选, 恢复原来的
 TIPS: 在图形编辑器中, 可以使用函数 ds_param(&amp;lsquo;参数名&amp;rsquo;) 来获取传入的参数值
 高级定制方法 # 如有更多个性化需求,可在需要点击的图形的编辑器中加入以下代码,仅需修改的是序号和参数名
-//比如传入多个参数进行联动 myChart__name__.on(&amp;#39;click&amp;#39;, function(params){ let myparam = params.seriesName; //获取点击的值 ds_setParam(&amp;#39;参数名&amp;#39;, myparam); //填写你的数据集的SQL设定中对应的参数名 ds_setParam(&amp;#39;参数名2&amp;#39;, myparam2); //你可以赋值给多个参数 ds_refresh(3); //3 为你要刷新图形序号 }); //函数方法说明 ds_setParam(&amp;#39;参数名&amp;#39;, 参数值) 此方法将自动判断当参数值为空时, 删除参数回到初始未传参状态 你还可以实现钻取到另外一个报表</description>
+//比如传入多个参数进行联动 myChart__name__.on(&amp;#39;click&amp;#39;, function(params){ let myparam = params.seriesName; //获取点击的值 ds_setParam(&amp;#39;参数名&amp;#39;, myparam); //填写你的数据集的SQL设定中对应的参数名 ds_setParam(&amp;#39;参数名2&amp;#39;, myparam2); //你可以赋值给多个参数 ds_refresh(3); //3 为你要刷新图形序号 }); //函数方法说明 ds_setParam(&amp;#39;参数名&amp;#39;, 参数值) 此方法将自动判断当参数值为空,null或0时, 删除参数回到初始未传参状态 所以请注意此方法无法传递参数空,null及0, 如需传递请将0转化成字符 你还可以实现钻取到另外一个报表</description>
     </item>
     
     <item>
@@ -458,12 +460,12 @@ import time import hashlib import os SMART_CHART_URL = &amp;#39;http://127.0.0.1
       <pubDate>Mon, 01 Jan 0001 00:00:00 +0000</pubDate>
       
       <guid>https://help.smartchart.cn/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/</guid>
-      <description>应用场景 # 类似于前后端开发, 后端会提供一些接口给前端, 但前端不一定需要在一打开页面就进行查询接口, 而是当有需要时再查询, 比如数据下载, 只有当用户有下载需求时再加载, 再比如有些与后台的数据联动, 我们只需要第一次加载时只显示第一层级, 点击时再加载其它层级
-开启数据集懒加载 # 在仪表盘&amp;quot;新增&amp;quot;&amp;ndash;&amp;gt;&amp;ldquo;懒加载数据集&amp;rdquo; 这时当打开仪表盘时, 此数据集不会被加载
-应用 # 一般懒加载数据集主要是用来做数据查询的, 所以并不太需要显示图形, 所以我们主要是用于在图形中进行赋值操作 比如先在模板中定义一个全局变量: 然后修改图形编辑中的代码: 即刷新数据集时会进行变量赋值
-如果您使用VUE, 使用会更方便, 你可以直接使用vapp.变量名 = dataset进行赋值给到vue的变量空间
-查询数据 # 你可以随时手动触发数据集的刷新, 比如懒加载的数据集序号为0 你可以在你需要触发刷新的地方调用ds_refresh(0)即可刷新0号数据集并执行0号数据集中的JS代码
-TIPS 当没有修改过懒加载数据集的图形时, 默认的全局变量为 &amp;ldquo;data序号&amp;rdquo; 如懒加载数据集序号为0, 可使用data0获取数据集刷新后的数据</description>
+      <description> 应用场景 # 类似于前后端开发, 后端会提供一些接口给前端, 但前端不一定需要在一打开页面就进行查询接口, 而是当有需要时再查询, 比如数据下载, 只有当用户有下载需求时再刷新数据 再比如有些与后台的数据联动, 我们只需要第一次加载时只显示第一层级, 点击时再加载其它层级 开启数据集懒加载 # 在仪表盘&amp;quot;新增&amp;quot;&amp;ndash;&amp;gt;&amp;ldquo;懒加载数据集&amp;rdquo; 当打开仪表盘时, 此数据集不会被加载
+应用 # 刷新数据 # 你可以随时手动触发数据集的刷新, 比如懒加载的数据集序号为0, 你可在需要触发刷新的JS代码段调用ds_refresh(0), 即可刷新0号数据集并执行0号数据集图形中的JS代码
+使用数据 # 当没有修改过懒加载数据集的图形时,默认的全局变量为&amp;quot;data序号&amp;quot;, 例如懒加载数据集序号为0, 你可在任意数据集的图形或模板中使用data0来获取数据集刷新后的数据
+数据处理 # 在有些场景, 你可能需要对懒加载的数据进行一些处理, 你可以在懒加载的图形中自定义处理逻辑, 比如我们需要把数据转化成vue常用的格式, 然后给vue的变量赋值:
+let dataset = __dataset__; dataset = ds_createMap_all(dataset); vapp.ds1 = dataset; //赋值给vue 参数传递 # 在有一些场景,需要在前端获取参数, 之后触发数据查询, 比如筛选项. 你可以使用ds_setParam(&amp;lsquo;参数名&amp;rsquo;, 参数值)设定参数, 比如刷新1号数据集
+ds_setParam(&amp;#39;city&amp;#39;, &amp;#39;顺德&amp;#39;); ds_setParam(&amp;#39;province&amp;#39;, &amp;#39;广东&amp;#39;); ds_refresh(1); </description>
     </item>
     
     <item>
@@ -535,7 +537,8 @@ $(&amp;#39;#id_down1&amp;#39;).click(()=&amp;gt;{ ds_download(&amp;#39;报表数
       
       <guid>https://help.smartchart.cn/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/</guid>
       <description>新建仪表盘 # 在开发模式下，滑动“开发管理” -&amp;gt;&amp;ldquo;仪表盘&amp;rdquo;-&amp;gt; &amp;ldquo;新增Dashboard&amp;rdquo; 填写相应信息后点击“保存” 点击进入仪表盘开发, 注意点击 &amp;ldquo;E&amp;rdquo; 字!! 点击新增&amp;ndash;&amp;gt;复杂报表 数据集编辑 # 点开“数据集” 输入以下SQL后，点击“保存并刷新”, 关闭数据集编辑界面 select H1 as 英雄名称, sum(qty) as 英雄1出场数 from smartdemo2 group by H1 order by sum(qty) desc; select count(1) as 总出场数 from smartdemo2 报表页面开发 # 和excel一样, 编辑相应表格 点击&amp;quot;数据集图标&amp;quot;(再次点击隐藏), 显示数据集字段名, 选中单元格, 单击字段名填入 点击&amp;quot;获取数据&amp;quot;, 可对真实数据调整样式 点击&amp;quot;保存&amp;quot; 点击&amp;quot;预览&amp;quot;, 可查看最终效果 导入EXCEL/WPS开发的模板 # 你也可直接导入excel或wps开发好的模板, 点击左下方的上传即可
-当然我们还有更多可定制的功能, 自行探索吧 也可购买专业版本解锁高级用法</description>
+关于自动填充方式 # 填充方向 # 默认的填充方向, 是按列方向向下填充 如果需要按行方向向右填充, 可在单元格字段标识后面加上__, 如下:
+#df0.英雄名称__ 格式填充 # 默认不会填充格式, 采用单元格自身的格式 如果需要自动采用&amp;quot;单元格字段标识&amp;quot;的格式, 可在单元格字段标识后面加上!</description>
     </item>
     
     <item>
diff --git a/docs/tags/index.html b/docs/tags/index.html
index 781ca6e..5b202a0 100644
--- a/docs/tags/index.html
+++ b/docs/tags/index.html
@@ -15,7 +15,7 @@
 <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.0cafae4d190a479ae3c320e16c447a1550cfbdf76a9a12df12857cb80633ead6.js" integrity="sha256-DK&#43;uTRkKR5rjwyDhbER6FVDPvfdqmhLfEoV8uAYz6tY=" crossorigin="anonymous"></script>
+  <script defer src="/en.search.min.0cd0a5a6c5c00c4df8510e577016e7c22b3b43cfba14681803425f7dfb33a19e.js" integrity="sha256-DNClpsXADE34UQ5XcBbnwis7Q8&#43;6FGgYA0JfffszoZ4=" crossorigin="anonymous"></script>
 
   <script defer src="/sw.min.6f6f90fcb8eb1c49ec389838e6b801d0de19430b8e516902f8d75c3c8bd98739.js" integrity="sha256-b2&#43;Q/LjrHEnsOJg45rgB0N4ZQwuOUWkC&#43;NdcPIvZhzk=" crossorigin="anonymous"></script>
 <link rel="alternate" type="application/rss+xml" href="https://help.smartchart.cn/tags/index.xml" title="Smartchart开发手册" />