axure使用中继器画柱状图

news2024/11/14 11:22:22

源文件在顶部。

在axure通过读取中继器中的数据来画柱状图,如下图:

1)创建一个中继器,在里面创建两列:1列是柱状图底部的名称、2列是柱的高度,如下图:

2)双击中继器,画一个矩形作为柱(命名为柱),下方添加一个标签作为名称(命名为名称),如下图:

3)将中继器“样式-布局”改为横向,这样所有的列表就横向排列了。

4)现在可以看到每列都显示相同的柱和名称,接下来就需要添加交互,使中继器在载入时,读取中继器内容的内容,为中继器添加第一个交互事件
载入时,设置文本-名称为中继器第一列数据的值,如下图:

这里的值点击fx去选择中继器数据,如下图:


此时就可以看到柱底部的名称按照第一列一一对应了,如下图:

然后为中继器添加第二个交互事件
载入时,设置柱的矩形宽度为target.width,高度为最大高度的一定比例,需要使用公式计算:target.height*(Item.no/1000),如下图:

锚点在底部,如下图:

可以看到所有的柱也根据中继器第二列的数据显示了,如下图:

说明一下这个公式的意义:这里的target.height就是柱默认矩形的高度(这里通过读取target.height而不是用固定值是为了以后矩形的高度变化也能自动适应),Item.no是中继器no一列的数据,1000是最大高度值(对应的是默认矩形的高度),通过公式就可以换算出数据值对应的矩形高度值。

5)为了方便查看,可以在根据中继器的位置添加刻度线,1000数字对应的就是矩形的默认高度。

将中继器的边框粗细设置为0,为柱设置渐变色,如下图:

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1813266.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

springmvc 全局异常处理器配置的三种方式深入底层源码分析原理

文章目录 springmvc 全局异常处理器配置的三种方式&深入底层源码分析原理配置全局异常处理器的三种方式实现接口HandlerExceptionResolver并配置到WebMvcConfigurer注解式配置ExceptionHandlercontroller里方法上定义ExceptionHandler 深入源码分析进入DispatcherServlet执…

防泄密的方法?用迅软DSE加密软件可靠吗?

防止泄密常用的方法则是使用加密软件,把文件转换为密文,这样一来,未授权的人员打不开,查看不到内容,也就防止了泄密行为的出现。只需用到加密软件,即可保护数据。 用迅软DSE加密软件可靠吗? 特…

【算法与数据结构】【数组篇】【题6-题10】

系列文章 本人系列文章-CSDN博客https://blog.csdn.net/handsomethefirst/article/details/138226266?spm1001.2014.3001.5502 1.数组基本知识点 1.1概念 数组就是一个集合。数组会用一些名为索引的数字来标识每项数据在数组中的位置,且在大多数编程语言中&…

java float 无处不是陷阱

小数位随意&#xff0c;不确定。 public float payerAmt; 数据库是 decimal&#xff08;10,2&#xff09; 页面输入后&#xff0c;保存到数据库竟然是随意的一个小数点&#xff0c; 中间没有经过任何运算&#xff0c;输入 - 保存 <result column"payer_amt" …

计算机图形学入门08:反走样、滤波与卷积

1.抗锯齿(反走样) 在上一章中&#xff0c;在光栅化三角形的时候出现了明显的锯齿效果。如下图所示是三角形采样过程&#xff1a; 从图上可知像素点不是纯红色就是纯白色。如果在采样前先进行模糊操作(滤波)&#xff0c;如下图所示&#xff1a; 经过模糊操作后三角形的边缘颜色变…

了解多线程

1.线程与并发 1.1 理解进程和线程的区别 进程&#xff1a;是指一个内存中运行的应用程序&#xff08;程序的一次运行就产生一个进程&#xff09;&#xff0c;每个进程都有自己独立的一块内存空间&#xff0c;比如在Windows的任务管理器中&#xff0c;一个运行的xx.exe就是一个进…

一个热门的源码整站数据打包完整代码(开箱即用),集成了最新有效数据和完美wordpress主题。

分享一个资源价值几千元的好代码资源网整站打包代码&#xff0c;这个wordpress网站基于集成了ripro9.1完全明文无加密后门版本定制开发&#xff0c;无需独立服务器&#xff0c;虚拟主机也可以完美运营&#xff0c;只要主机支持php和mysql即可。整合了微信登录和几款第三方的主题…

AGP7+ 适配 plugin 动态引入第三方插件

AGP4 适配前 def hwPlugin com.huawei.agconnectmProject.getPlugins().apply(hwPlugin)AGP7 适配后 在 AGP4 如果仍然使用上述代码&#xff0c;那么编译期会报错&#xff0c;升级版本之后使用下面的pluginManager 即可。 def hwPlugin com.huawei.agconnectmProject.plug…

Studio One安装教程+软件安装包下载

Studio One6全新版本上线 记录、生产、混合、掌握和执行所有操作。从工作室到舞台&#xff0c;Studio One6以易用为核心&#xff0c;是您的创意合作伙伴。 当你准备好登上舞台时&#xff0c;Studio One就在那里。只有Studio One从最初的灵感到完整的制作&#xff0c;最终混音…

3D感知视觉表示与模型分析:深入探究视觉基础模型的三维意识

在深度学习与大规模预训练的推动下&#xff0c;视觉基础模型展现出了令人印象深刻的泛化能力。这些模型不仅能够对任意图像进行分类、分割和生成&#xff0c;而且它们的中间表示对于其他视觉任务&#xff0c;如检测和分割&#xff0c;同样具有强大的零样本能力。然而&#xff0…

(三十八)Vue之插槽Slots

文章目录 插槽介绍插槽分类默认插槽具名插槽条件插槽动态插槽名 作用域插槽默认作用域插槽具名作用域插槽 上一篇&#xff1a;&#xff08;三十七&#xff09;vue 项目中常用的2个Ajax库 插槽介绍 在之前的文章中&#xff0c;我们已经了解到组件能够接收任意类型的值作为 prop…

【品质】如何培养幽默感,如何幽默的沟通与应对生活(自卑vs自信,悲观vs乐观)

【品质】如何培养幽默感&#xff0c;如何幽默和正能量的沟通与应对生活&#xff08;自卑vs自信&#xff0c;悲观vs乐观&#xff09; 文章目录 一、性格底色&#xff08;自我认知&#xff0c;世界观&#xff09;1、从悲观的底色开始2、用摆烂、自嘲的方式与世界和解 二、沟通方法…

2024050802-重学 Java 设计模式《实战模板模式》

重学 Java 设计模式&#xff1a;实战模版模式「模拟爬虫各类电商商品&#xff0c;生成营销推广海报场景」 一、前言 黎明前的坚守&#xff0c;的住吗&#xff1f; 有人举过这样一个例子&#xff0c;先给你张北大的录取通知书&#xff0c;但要求你每天5点起床&#xff0c;12点…

mysql和redis备份和恢复数据的笔记

一、mysql的备份及恢复方法&#xff1a; 1.完全备份与恢复 1.1物理备份与恢复 物理备份又叫冷备份&#xff0c;需停止数据库服务&#xff0c;适合线下服务器 备份数据流程&#xff1a; 第一步:制作备份文件 systemctl stop mysqld #创建存放备份文件的目录 mkdir /bakdir …

医疗行业携手用友BIP收入云,开启高效收入管理新时代

在医疗行业&#xff0c;收入管理是实现可持续发展的重要环节。随着医疗改革的深入和市场竞争的加剧&#xff0c;医疗机构需要寻找有效的收入管理破局方法。用友BIP收入云作为一款强大的收入管理工具&#xff0c;为医疗行业提供了有力的支持。 一、医疗行业收入管理破局方法 精细…

多视图变换矩阵与SLAM位姿估计中的地图点投影的几何约束

定义 Homography & projective transform M ( 3 4 ) [ f s x c ′ 0 a f y c ′ 0 0 1 ] [ 1 0 0 0 0 1 0 0 0 0 1 0 ] [ R 3 3 0 3 1 0 1 3 1 ] [ I 3 3 T 3 1 0 1 3 1 ] \underset{(3 \times 4)}{\mathbf{M}}\left[\begin{array}{ccc} f & s & x_c^{\pr…

前端已学习内容

一、HTMLCSS 1、黑马B站视频-27小时 地址&#xff1a;基础班导学-精讲与实战_哔哩哔哩_bilibili 说明&#xff1a;讲义已下载。两个小项目还没学没练。 2、菜鸟教程 地址&#xff1a;HTML 简介 | 菜鸟教程 二、JavaScript 1、菜鸟教程 网址&#xff1a;JavaScript 教程 …

【点击收藏】鸿蒙HarmonyOS实战开发—如何实现应用悬浮窗

前言 鸿蒙登场&#xff01;它的征途是万物互联 备受瞩目的华为HarmonyOS 2&#xff08;即鸿蒙系统&#xff09;正式发布。同时&#xff0c;华为发布了多款搭载鸿蒙系统的新产品&#xff0c;包括Mate 40系列新版本、Mate X2新版本、华为WATCH 3系列、华为MatePad Pro等手机、智能…

vue-editor设置字体font-family

背景&#xff1a;Vue项目中需要用到富文本编辑器&#xff0c;所以选择了vue-editor这个富文本编辑器&#xff0c;发现字体font-family只有三种Sans Serif、Serif、MonoSpace可以选择&#xff0c;满足不了产品的需求&#xff0c;所以用想要定义成常用字体&#xff0c;主要是需要…

AGI时代的奠基石:Agent+算力+大模型是构建AI未来的三驾马车吗

★AI Agent&#xff1b;人工智能体&#xff0c;RPA&#xff1b;大语言模型&#xff1b;prompt&#xff1b;Copilot&#xff1b;AGI&#xff1b;ChatGPT&#xff1b;LLM&#xff1b;AIGC&#xff1b;CoT&#xff1b;Cortex&#xff1b;Genius&#xff1b;MetaGPT&#xff1b;大模…