如何制作一个数字大屏看板【入门帖】

可视化未结 0 293

rolldata 站长 2023年9月5日 09:56 编辑

<h2>1. 数字大屏设计器</h2>首先登录产品，在上方导航栏右边打开控制台； <img src="http://help.wrenchdata.com/uploaded/202309/20230905094319_1n.png" style="box-shadow: rgb(51, 51, 51) 0px 0px 5px; max-width: 100%;"> 点击数据建模与分析模块中→数字大屏设计器，如下所示： <img src="http://www.wrenchdata.com:8443/images/5/65.png"> 现在打开的是数字大屏设计器界面： ①此处是数字大屏图形化组件区域； ②此处是数字大屏可视化控件区域； ③此处分别有预览、保存和发布操作，可以对数字大屏进行相应的操作； ④此处是图形和控件图层区域； ⑤此处是数字大屏设计区域。 <h2>2. 构建数字大屏</h2><h3>2.1 数字大屏布局</h3>首先来布局数字大屏如下所示包含文本、实时时间、翻牌器，条形象形图、图片、柱形图、面积图和条形图如下所示； <img src="http://www.wrenchdata.com:8443/images/5/66.png"> 数字大屏的整体背景通过上方的主题按钮进行配置，打开主题，整体背景处选择图片，点击上传自定义图片确定即可； <img src="http://www.wrenchdata.com:8443/images/5/67.png"> <h3>2.2 绑定模型</h3><h4>2.2.1 条形象形图</h4>1）绑定数据：选中象形图，打开右上角的数据绑定出现选择模型区域，选择投资额统计分析模型，将维度“省”和度量“实际投资”拖入到对应区域，并且按照“实际投资”给它设置一个“正序”的排序方式，打开后面的下拉箭头即可设置； <img src="http://www.wrenchdata.com:8443/images/5/68.png"> 2）属性配置 基础：打开右上角配置按钮，出现属性配置区域，在基础通用的背景设置里选择“内置图片”点击上传出现图片选择的弹窗，打开自定义上传，在本地中选择准备好的图片点击确定即可； <img src="http://www.wrenchdata.com:8443/images/5/69.png"> 标题：输入主标题内容“重点项目投资额TOP10”，打开标题样式，左侧安放位置选择“居中”，标题内边距输入“20”，主标题色号修改为“#14fcfa”，字号为“14”； 视区：图形位置上下左右调整到合适位置。 <h4>2.2.2 柱形图（左下）</h4>1）绑定数据：选中下方的柱形图，打开右上角的数据绑定出现选择模型区域，选择投资额统计分析模型，将维度“省”和度量“预计投资、实际投资、投资占比”拖入到对应区域如下所示； <img src="http://www.wrenchdata.com:8443/images/5/70.png"> 2）属性配置 基础：打开右上角配置按钮，出现属性配置区域，在基础通用的背景设置里选择“内置图片”点击上传出现图片选择的弹窗，打开自定义上传，在本地中选择准备好的图片点击确定； <img src="http://www.wrenchdata.com:8443/images/5/71.png"> 打开系列0，平面区域开始颜色和结束颜色都设为“#fdb037”，结束颜色的透明度设置为0如下所示； <img src="http://www.wrenchdata.com:8443/images/5/72.png"> 在柱外观设置节点将柱条宽度设置为“18px”； 系列1以同样的方式进行设置，色号为“#45fde2”； 系列2将图形类型改为“折线”，多Y轴时选择“B轴”； <img src="http://www.wrenchdata.com:8443/images/5/73.png"> 标题：输入主标题内容“重点项目投资额TOP10”，打开标题样式，左侧安放位置选择“居中”，标题内边距输入“20”，主标题色号修改为“#14fcfa”，字号默认为“14”； 视区：图形位置上下左右调整到合适位置； X轴：打开X轴的轴线，将颜色设置为“#666666”，标签颜色设置为“#999999”； Y轴A：打开Y轴A的轴线，将颜色设置为“#666666”，标签颜色设置为“#999999”； Y轴B：打开Y轴B的轴线，将颜色设置为“#666666”，标签颜色设置为“#999999”； 图例：图里的上侧距离调整为“20px”，色块宽高调整为“12px”文字颜色修改为“#999999”； <h4>2.2.3柱形图（右上）</h4>1）绑定数据：选中柱形图，打开右上角的数据绑定出现选择模型区域，选择投资行业分析模型，将维度“行业”和度量“占比”拖入到对应区域如下所示； <img src="http://www.wrenchdata.com:8443/images/5/74.png"> 2）属性配置 基础：打开右上角配置按钮，出现属性配置区域，在基础通用的背景设置里选择“内置图片”点击上传出现图片选择的弹窗，打开自定义上传，在本地中选择准备好的图片点击确定； <img src="http://www.wrenchdata.com:8443/images/5/75.png"> 打开系列0，平面区域开始颜色设置为“#19e9ef”，结束颜色设为“#0592e0”； <img src="http://www.wrenchdata.com:8443/images/5/76.png"> 同时数据项标签据上显示； <img src="http://www.wrenchdata.com:8443/images/5/77.png"> 标题：输入主标题内容“投资行业占比分析”，打开标题样式，左侧安放位置选择“居中”，标题内边距输入“20”，主标题色号修改为“#14fcfa”，字号默认为“14”； 视区：图形位置上下左右调整到合适位置； X轴：打开X轴的轴线，将颜色设置为“#666666”，标签颜色设置为“#999999”； Y轴：打开Y轴的轴线，将颜色设置为“#666666”，标签颜色设置为“#999999”； 图例：图里的上侧距离调整为“20px”，色块宽、高调整为“12px”文字颜色修改为“#999999”； <h4>2.2.4 面积图</h4>1）绑定数据：选中面积图，打开右上角的数据绑定出现选择模型区域，选择三大产业投资分析模型，将维度“年月”和度量“农业、工业、服务业”拖入到对应区域如下所示； <img src="http://www.wrenchdata.com:8443/images/5/78.png"> 2）属性配置 基础：打开右上角配置按钮，出现属性配置区域，在基础通用的背景设置里选择“内置图片”点击上传出现图片选择的弹窗，打开自定义上传，在本地中选择准备好的图片点击确定； <img src="http://www.wrenchdata.com:8443/images/5/79.png"> 打开系列0，系列特定主色调整为“#7255e6”，填充颜色同样的色号，透明度拉到五分之一的位置如下所示； <img src="http://www.wrenchdata.com:8443/images/5/80.png"> 折线转为平滑曲线处设置为“否”； 打开系列1，系列特定主色调整为“#1ee1ff”填充颜色同样的色号，透明度拉到五分之一的位置，显示数据标注处选择“是”，折线转为平滑曲线处设置为“否”； 打开系列2，系列特定主色调整为“#ffc261”填充颜色同样的色号，透明度拉到五分之一的位置，折线转为平滑曲线处设置为“否”； 标题：输入主标题内容“三大产业数据分析”，打开标题样式，左侧安放位置选择“居中”，标题内边距输入“20”，主标题色号修改为“#14fcfa”，字号默认为“14”； 视区：图形位置上下左右调整到合适位置； X轴：打开X轴的轴线，将颜色设置为“#666666”，标签颜色设置为“#999999”； Y轴：打开Y轴的轴线，将颜色设置为“#666666”，标签颜色设置为“#999999”； 图例：图里的上侧距离调整为“20px”，色块宽、高调整为“12px”文字颜色修改为“#999999”； <h4>2.2.5 条形图</h4>1）绑定数据：选中条形图，打开右上角的数据绑定出现选择模型区域，选择投资项目数量分析模型，将维度“年份”和度量“项目数（个）、总投资（亿元）”拖入到对应区域如下所示； <img src="http://www.wrenchdata.com:8443/images/5/81.png"> 2）属性配置 基础：打开右上角配置按钮，出现属性配置区域，在基础通用的背景设置里选择“内置图片”点击上传出现图片选择的弹窗，打开自定义上传，在本地中选择准备好的图片点击确定； <img src="http://www.wrenchdata.com:8443/images/5/82.png"> 打开系列0，平面区域颜色渐变的开始颜色设置为“#13d5d5”，结束颜色设置为“#07a0f9”，颜色渐变方向在X0处修改为“1”，其他均为“0”，柱条宽度改为“12px”，数据项标签是否显示选择“是”，显示位置“居右”； 打开系列1，平面区域颜色渐变的开始颜色设置为“##c354ff”，结束颜色设置为“#07a0f9”，颜色渐变方向在X0处修改为“1”，其他均为“0”，柱条宽度改为“12px”，数据项标签是否显示选择“是”，显示位置“居右”； 标题：输入主标题内容“投资项目数量分析”，打开标题样式，左侧安放位置选择“居中”，标题内边距输入“20”，主标题色号修改为“#14fcfa”，字号默认为“14”； 视区：图形位置上下左右调整到合适位置； X轴A：基础坐标是否显示选择“否”； X轴B：基础坐标是否显示选择“否”； Y轴：打开Y轴的轴线，将颜色设置为“#666666”，标签颜色设置为“#999999”； 图例：图里的上侧距离调整为“20px”，色块宽、高调整为“12px”文字颜色修改为“#999999”； <h4>2.2.6 翻牌器</h4>1）绑定数据：打开翻牌器右上角的数据绑定出现选择模型区域，选择投资总额分析模型，将维度“投资总额”拖入到对应区域如下所示； <img src="http://www.wrenchdata.com:8443/images/5/83.png"> 2）属性配置：打开右上角配置按钮，出现属性配置区域，在基础通用的背景设置里选择“内置图片”点击上传出现图片选择的弹窗，选择以下图片进行上传；内部设置的宽高等按照以下内容调整，前缀内容输入“本季度总计投资金额（万元）”，居左显示。 <img src="http://www.wrenchdata.com:8443/images/5/84.png"> <h4>2.2.7 图片</h4>属性配置：打开属性配置，在背景设置中选择内置图片，点击上传自定义图片，点击确定。 <img src="http://www.wrenchdata.com:8443/images/5/85.png"> <h4>2.2.8 标题</h4>这里是一个文本框，输入标题内容“行业投资分析数据可视化”，字号大小设置“32px”，色号设置“#25bcf0”； <img src="http://www.wrenchdata.com:8443/images/5/86.png"> <h4>2.2.9 实时时间</h4>这里是一个实时时间控件，日期格式选择“日期+时分秒+星期”，也可以进行自定义格式设置，字体大小设置“14px”，色号为“#25bcf0”； <img src="http://www.wrenchdata.com:8443/images/5/87.png"> 完成以上一系列步骤最后在进行位置的细节调整，拖动组件上方按钮就可以，调整后这个简单的数字大屏就已经完成了，想要添加或修改图形属性的，自行进行设置即可。

相关标签：驾驶舱移动端数字大屏数据模型管理
注意：本文归作者所有，未经作者允许，不得转载

0个回复

消灭零回复

如何制作一个数字大屏看板【入门帖】

友情链接