# Smartchart开发手册

https://help.smartchart.cn/docs/4.%E5%B8%83%E5%B1%80%E8%AF%B4%E6%98%8E/ Recent content on Smartchart开发手册 Hugo -- gohugo.io

#

https://help.smartchart.cn/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/ Mon, 01 Jan 0001 00:00:00 +0000 https://help.smartchart.cn/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/ SmartChart布局说明 # 推荐先观看视屏了解 smartchart布局方式 容器说明 # 容器 说明 定位容器 用于图形定位, 有拖拽和栅格两种. 在界面上新增时会自带;在模板编辑中新增图形时需自行加入容器 图形容器 用于图形选择, 使用id选择器, 如序号为2的容器, 选择器为#container_2 图形 可视化的实际单位, 如选择图形中的table标签, 可使用#container_2 table 6.0版本中拖拽布局方式已可同时满足电脑端/移动端的需求 响应式布局 # 当你新增一个栅格图形时, smartchart会给你一段默认的代码 &lt;div class=&#34;el-col-xs-24 el-col-md-24&#34; style=&#34;padding:0.2rem;height:50%;&#34; &gt; &lt;div style=&#34;height:100%;&#34; id=&#34;container_{name}&#34;&gt;&lt;/div&gt; &lt;/div&gt; 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) # 只是用响应式布局可能对于复杂的布局不是很方便, 你也可以采用拖拽绝对定位的方法, 这样你可以随意指定图形的所在位置.

#

https://help.smartchart.cn/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/ Mon, 01 Jan 0001 00:00:00 +0000

https://help.smartchart.cn/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/
拖拽很方便, 但是精确对齐还是有些手抖, 所以smartchart增加了自动对齐的功能 你可以在&quot;模板&quot; &ndash;&gt; &ldquo;转化&rdquo; 中找到这个功能 首先我们随意拖拽了一些组件 然后选中拖拽代码段, 点&quot;拖拽对齐&quot; 后 点&quot;保存&quot; 就可以查看对齐后的效果了, 再进行下拖拽微调, 重复以上动作到满意

#

https://help.smartchart.cn/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/ Mon, 01 Jan 0001 00:00:00 +0000

https://help.smartchart.cn/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/
对于仪表盘中不再使用的数据集，你可能会考虑删除 首先smartchart推荐你不做删除，因为你可以保留他， 当你下次有新增数据集的需求时再拿出来 所以优先推荐使用隐藏的方法,你可以在数据集编辑界面找到他 如果你实在需要删除，可以在“报表”界面先中不需要容器后，选中删除，后保存