复杂业务图表嵌入应用画布

操作步骤

• 首先绘制一张业务画布

• 点击生成经营指控

• 然后到经营指控界面，点击分享。

• 在分享界面依次点击“开放接口调用”，“生成分享链接”两项

  拷贝分享链接，在后面追加参数&huabuid=xxx&isinterface=1

  上面的huabuid是经营画布的某个画布的ID，查询方法是：在经营画布下方，右键画布名称，选择“接口信息”，将画布id取出即可。

• 将第5步得到的url的域名部分去掉，留下形如 /shareproject?taskid=xxx&projectid=xxx&sign=xxx&huabuid=xxx&isinterface=1，在应用画布拖拽iframe控件，在控件属性的页面地址处填上即可

• 在使用iframe控件时，多半需要调整其大小，此时点击外观标签，在高度处填上合适的像素值即可

视频讲解

若iframe控件添加经营画布的地址后，显示内容不能自适应显示器的大小，如何处理？

1、 业务画布，属于画布图表的设计态

在业务画布中可以设计画布大小，设置后，业务画布任何分辨率的显示器上打开，大小都保持不变。

2、 经营画布和分享画布，属于运行态

经营画布和分享画布的大小取决于画布在业务画布上的设置。

2.1、如果 ，生成的经营画布和分享画布，为固定大小。在任何分辨率的显示器上打开画布，大小都保持不变。

2.2、如果 ，生成的经营画布和分享画布自适应。根据分辨率的大小自动设置画布的宽度和高度，画布中的图表根据比例自动缩放。

缩放的规则：

获取当前浏览设备上网页宽度，根据宽度，和业务画布时画布的宽高比自动计算高度。

3、 iframe方式嵌入画布的大小设置

关于大小设置的参数style，outheight ，margin。

1、 宽度和高度都自适应

此时可以不设置style参数和outheight参数；可以根据自己的需求设置margin的值。

适用于画布为页面主要部分，例如如下的页面：

例如：https://adp.hylanda.com/shareproject?taskid=547&projectid=322&sign=20220223164056b21cd62b&displayfull=1&scroll=0&fullSize=1&name=%E8%A7%86%E8%A7%89%E6%95%88%E6%9E%9C&huabuid=1729&isinterface=1&margin=10

2、 宽度自适应，高度外部设置

例如 画布页面为小页面中小部分，而且是横向长条分布。如下图布局形式：

可以设置宽度为100%，高度设置业务画布上的实际高度。并根据需要设置margin的值。

例如：

http://adp.hylanda.com/shareproject?taskid=547&projectid=322&sign=202203031750275ff86991&displayfull=1&scroll=0&fullSize=1&name=%E8%A7%86%E8%A7%89%E6%95%88%E6%9E%9C&huabuid=1740&isinterface=1&style={"width":"100%","height":"212"}&margin=0&outheight=1

其他示例：

http://adp.hylanda.com/shareproject?taskid=547&projectid=322&sign=202203031750275ff86991&displayfull=1&scroll=0&fullSize=1&name=%E8%A7%86%E8%A7%89%E6%95%88%E6%9E%9C&huabuid=1741&isinterface=1&style={"width":"100%","height":"700"}&margin=0&outheight=1

问题没有解决？请留言提问