百度数据可视化Sugar

    报表制作入门

    新建报表

    首先从空间广场中选择一个空间(您必须是该空间的管理员)并进入:

    图片

    在左侧的管理中心中进入「报表管理」,点击新建报表页面并新建一个报表:

    图片

    新建好后,点击报表后的眼睛图标进入新建的空报表页面:

    图片

    添加图表并绑定 SQL 模型

    新建的空报表页面中没有内容,点击右上角的编辑按钮可以进入编辑模式:

    图片

    在顶部栏中选择折线图:

    图片

    点击刚添加的折线图,右侧的控制面板会展示该折线图的配置项,在「数据」标签页中,选用 SQL 建模的方式来绑定图表数据:

    图片

    现在还没有 SQL 模型,点击上图中加号「新建 SQL 模型」,可见到:

    图片

    • 首先填写模型的名称,并选择之前在准备工作中已经创建好的数据源
    • 然后编写查询数据的 SQL 语句
    • 最后将需要的字段添加到模型中,并设置好相应的数据类型

    SQL 模型的详细可参见:「SQL 方式绑定数据」。

    接下来在折线图的控制面板中,将 X 轴和 Y 轴与对应的数据列绑定:

    图片

    点击上图中「调试」按钮会弹出如下调试界面:

    图片

    在编辑报表的过程中请一定善用「调试」功能,在这里可以定位到绝大部分问题。

    在调试中我们可以看到:

    • 过滤条件作为参数被 POST 到后端(目前没有过滤条件,所以这里是空)
    • 您输入的原始 SQL 语句
    • 最终生成的在数据库中查询的 SQL 语句
    • SQL 查询的原始结果
    • Sugar进行转化操作后的中间结果
    • 格式化为图表可以读取的数据 JSON 格式结果

    如果都没有问题,点击刷新图表,就可以看到结果了:

    图片

    图表的详细配置请参考「图表制作概述」。

    上面的步骤已经描述了一个简单的报表使用场景。但是,如果您需要对数据进行过滤,可以让浏览报表的用户可以和页面进行交互,从而让展示的数据动态化,那么您需要浏览下面的章节。

    添加过滤条件

    以『日期范围』作为示例,在页面顶部选择日期范围过滤条件:

    图片

    单击选中刚添加的日期范围过滤条件,在该过滤条件的右侧控制面板「基础」标签页下填写「查询 key 值」为date1

    图片

    可以配置日期范围过滤条件的默认值、可选范围等,过滤条件的详细配置请参考「过滤条件概述」。

    将过滤条件与图表关联

    接下来我们将这个过滤条件和折线图的 SQL 模型进行关联。

    单击折线图,右侧控制面板中,编辑刚才新建的 SQL 模型:

    图片

    在 SQL 语句中嵌入刚刚添加的日期范围查询条件,下图红框中的date1和上面我们给日期范围过滤条件填写的查询 key 值相对应:

    图片

    不同的过滤条件在伪 SQL 语句中的语法各不相同,详情请查看「SQL 语句中关联过滤条件」。

    在日期范围过滤条件中填入想查询的日期:

    图片

    点击折线图,并点击控制面板中「数据」中的「调试」:

    图片

    可以看到,伪 SQL 语句中的自定义语法在真正执行的 SQL 中被替换为了您填写的过滤条件。并且 SQL 查询的结果也符合过滤条件的要求。

    此时,你可以随意改变过滤条件中的值,然后点击过滤条件下的「查询」按钮,折线图的数据就会根据您的过滤条件而动态改变:

    图片

    至此,保存并退出编辑,您就完成了您的第一张可以动态过滤数据的可视化报表:

    图片

    上一篇
    概述和创建数据源
    下一篇
    大屏制作入门