|
嵌入式数据分析,即在企业现有业务系统中按需集成各类数据分析能力。随着越来越多企业重视BI的部署和应用,在内部实现嵌入式数据分析也展现出强烈需求。本文将具体介绍字节跳动内部嵌入式数据分析实践。文 |祖华、Lily来自字节跳动数据平台BI数据应用团队商业智能 (BI) 已经广泛被应用到用户实际业务过程中,如果BI作为独立应用平台应用,那么用户在日常使用业务系统(比如CRM/ERP/OA等)时,就需要经常切换不同系统,繁杂登录过程与应用系统的切换,会导致业务思考的中断,降低效率。这不利于BI在企业内做推广,也难实现IT应用管理平台的统一。因此将低门槛数据分析操作功能,和已完成的看板结果直接放置在业务系统程序的UI中,就会保证业务用户数据洞察的连续性和可用性。该篇文章以字节跳动内部应用的实操案例,来完成如下业务场景。业务场景案例一张小明同学希望在自己的运营平台上接入BI的可视化分析能力,能够在运营平台上通过点击、拖拽等页面交互方式便可以快速生成可视化图形,获取数据洞见。经过调研后决定集成Datawind平台,将自己的数据源通过数据准备导入到Datawind中作为数据集,并在运营平台上嵌入该数据集的可视化查询页面。之后可以直接在运营平台上直接做数据拖拽分析,极大地提高了数据分析效率。案例二王小红同学想要建立运营数据看板并分享给不同的地区经理,希望不同的地区经理只看到本地区数据。并且这些数据看板可以集成到地区经理最常用的CRM系统之中。小红发现Datawind能够满足制作数据看板的诉求,并且Datawind的行权限、自定义筛选器也能满足平台对数据权限控制的需要,也可以快速集成到自己的CRM系统中,最后决定使用嵌入Datawind仪表盘的方式搭建运营数据看板。案例三李小华同学需要对海量的商品交易记录进行查询。他希望使用这样一款查询工具:具备对海量明细数据的查询能力、支持丰富的筛选操作、能够配置表格和单元格样式、必要时可以对表格列的字段公式进行改写。确认Datawind满足需要后,李小华在Datawind上建立了明细数据报表并将其嵌入到商品交易管理系统中,让每个相关运营同学都能快速查询获得想要的数据结果。Iframe集成方案为了最方便快捷实现集成,可以通过Iframe的方式对接,操作方式如下。概述该操作需要开发人员完成,主要操作步骤如下所示:Step 1. 获得目标仪表盘/图表的URL链接Step 2. 链接修改Step 3. 生成代码该开发人员建议在需要操作的项目中赋予项目管理员权限,完成后再根据实际情况赋予权限。Step 1.获得目标仪表盘/图表的URL链接如下两种方式均可获得目标仪表盘/图表/大屏的链接,得到的结果是一致的仪表盘移动端则只能按照第二种方式获得1. 直接在产品中获得(1)仪表盘/图表图表进入到仪表盘预览状态点击需嵌入图表右侧,选择「嵌出图表」显示「复制成功」,之后可以鼠标右键复制,或者键盘crtl+V即可仪表盘进入到仪表盘预览状态点击需嵌入图表右侧,选择「嵌出仪表盘」显示「复制成功」,之后可以鼠标右键复制,或者键盘crtl+V即可。(2)大屏如图在列表页选择查看,打开之后复制浏览器URL即可2. 自行拼接选择自行拼接,则按照如下方式进行,划下划线内容是变量,在如下参数详解要解释的,其他为固定内容仪表盘$HOST/#/external/dashboard/$DASHBOARD_IDappId=$APP_ID&inline=true比如:https://console.volcengine.com/bi#/external/dashboard/47610appId=1010681&inline=true移动端仪表盘$HOST-h5/dashboard/appId=$APP_ID&id=$DASHBOARD_ID&inline=true比如:https://console.volcengine.com/bi-h5/dashboard/appId=1010681&id=47610&inline=true注意:移动端链接只能移动端设备访问,如果该链接在PC端打开,则默认跳转为PC端链接。图表$HOST/#/external/dashboard/$DASHBOARD_ID/$REPORT_IDappId=$APP_ID&inline=true比如:https://console.volcengine.com/bi#/external/dashboard/47610/305962appId=1010681&inline=true可视化查询$HOST/#/dataQueryappId=$APP_ID&inline=true比如:https://console.volcengine.com/bi#/dataQueryappId=1010681&inline=true大屏$HOST/vScreen/previewappId=$APP_ID&id=$VSCREEN_ID&resizeMode=auto比如:https://console.volcengine.com/bi#/vScreen/previewappId=1010681&id=11&resizeMode=auto参数详解$HOSTSaaS环境设置为https://console.volcengine.com/bi私有化部署环境替换为产品部署的域名$HOST-h5移动端的域名SaaS环境设置为https://console.volcengine.com/bi-h5私有化部署环境替换为产品移动端部署的域名$APP_ID项目id。在项目下任意打开地址均可获得,如图所示,任意打开一个项目下的链接,URL如下所示,app_Id值为1010681https://console.volcengine.com/bi#/dashboard/47610appId=1010681$DASHBOARD_ID在列表页面打开需要外嵌的仪表盘,获得浏览器的URL链接如下,则dashboardId值为47610https://console.volcengine.com/bi#/dashboard/47610appId=1010681$REPORT_ID图表id,标识唯一的图表。可视化查询页面URL的 rid 表示图表id。在如下可视化查询链接中,reportId值为306828https://console.volcengine.com/bi#/dataQueryappId=1010681&id=98850742&rid=306828&sid=22569$VSCREEN_ID大屏id。在如下仪表盘链接中,vscreenId值为4750https://console.volcengine.com/bi#/vScreen/4750resizeMode=autoStep2.加入特性,修改链接在iframe的url中传入 feature 参数来配置通用特性,以下是该特性的解释说明,可以根据实际情况选择需要的特性。{ "dashboard": { // --- 仪表盘模块特性 --- "showHeader": true, // 显示Header "showFavor": true, // 显示收藏 "showOwner": true, // 显示owner "actions": [ // 仪表盘操作,数组类型 "refresh", // 刷新 "fullscreen", // 全屏 "share", // 分享 "subscribe", // 订阅 "snapshot", // 书签 "auth", // 授权 "edit", // 编辑 "setAsDefaultDashboard", // 设为默认仪表盘 "exportImage", // 导出图片 "embed", // 嵌出 "accessStatistics" // 访问统计 ], "report": { // --- 仪表盘图表特性 --- "showHeader": true, // 显示header "actions": [ // 仪表盘图表操作,数组类型 "imgExport", // 导出图片 "excelExport", // 导出excel "pivotExport", // 导出透视表 "copyToDashboard", // 复制图表 "embed", // 嵌出图表 "createMonitor" // 新建监控 ], }, "sheet": { // --- 仪表盘sheet特性 --- "tabPosition": "top" // tab页显示位置,可选top/left }, }}特性说明模块划分特性名特性解释特性值dashboardshowHeader是否显示/隐藏仪表盘的header头部truefalsedashboardshowFavor是否显示收藏仪表盘,仅showHeader值为ture才生效truefalsedashboardshowOwner是否显示仪表盘的owner,仅showHeader值为ture才生效truefalsedashboardactions仪表盘操作,数组类型,仅showHeader值为ture才生效;需要的操作直接填到数组中即可refresh 刷新 fullscreen 全屏auth 授权share 分享snapshot 书签subscribe 新建订阅和订阅管理 setAsDefaultDashboard 设置为默认仪表盘/取消设置为默认仪表盘embed 嵌出exportImage 导出图片reportshowHeader是否显示图表headertruefalsereportactions图表操作,数组类型,仅report的showHeader值为ture才生效;需要的操作直接填到数组中即可imgExport 导出图片 excelExport 下载createMonitor 新建监控pivotExport导出透视表,仅透视表存在该特性 copyToDashboard复制到仪表盘embed嵌出图表sheettabPosition仪表盘多sheet时,tab的显示位置top 居上left 居左Step3.生成代码根据上述获得的信息来拼接代码,比如以获得的仪表盘链接举例:https://console.volcengine.com/bi#/external/dashboard/47610appId=1010681&inline=true1. 生成HTML代码比如如下代码指的是隐藏仪表盘header2. 使用实例如果在使用 React 框架,参考如下实例在iframe的url中传入feature 参数来配置通用特性。feature 的类型为 JSON.stringify 后的特性配置对象。可以参考如下的iframe 嵌入代码隐藏仪表盘headerimport React from 'react'import ReactDOM from 'react-dom'class EmbedComponent extends React.Component { render() { return ( ) }}ReactDOM.render(, document.querySelector('body'))产品介绍火山引擎智能数据洞察DataWind:智能数据洞察是一款支持大数据明细级别自助分析的增强型 ABI 平台。从数据接入、数据整合,到查询、分析,最终以数据门户、数字大屏、管理驾驶舱的可视化形态呈现给业务用户,让数据发挥价值。后台回复数字“5”了解产品,并参与30天免费试用!点击阅读原文,立即参与DataWind免费试用
|
|