【Axure高保真原型】通过输入框动态控制环形图

已于 2023-08-14 21:24:50 修改
阅读量568 收藏
点赞数
文章标签： 交互 Axure 产品经理 原型 echarts
于 2023-08-14 21:23:59 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/mushe93/article/details/132286099
版权
本文介绍如何通过Axure创建一个原型模板，实现在输入框中实时更新环形图数据。用户编辑输入框中的数据，即可生成对应的图表，且鼠标悬停时显示详细数据。预览地址提供了实际效果体验。
摘要由CSDN通过智能技术生成

今天和大家分享通过输入框动态控制环形图的原型模板，在输入框里维护项目数据，可以自动生成对应的环形图，鼠标移入对应扇形，可以查看对应数据。使用也非常方便，只需要修改输入框里的数据，或者复制粘贴文本，即可以自动生成对应的环形图，具体效果可以观看下方视频或者打开预览地址体验。

【原型效果】

【Axure高保真原型】通过输入框维护环形图数据

图片

【原型预览及下载地址】

https://axhub.im/ax9/9a27399d9b2d17a5/#g=1&p=js环形图-输入框维护数据效果

梓贤Vigo
关注
Axure图表元件库（环比同比、环形、柱状、折线、饼状）
08-19
Axure元件库图表，其中包含环比同比图、环形图、柱状图、折线图、饼状图、综合统计图
【Axure高保真原型】能增删改的环形图
mushe93的博客
01-18 345
今天和大家分享能自增删改的环形图模板~~~
Axure第5讲：制作环形
不患无位，患所以立；不患莫己知，求为可知也
08-27 4863
1、从元件库中拖入一个矩形至画布，如下图1。 图1 2、在右侧“检视”窗口中选择“属性》形状》选择形状”，选择带圈口的圆形，如下图2。 图2 3、选中带缺口的圆形后，将其宽和高分别设置为260、260，见下图3。 图3 4、手工将其缺口调整为1/4大小，效果见图4。 图4 5、从元件库选择一个椭圆形至画布，将其宽和高分别设置为230、230，之后拖动圆形，将其与带缺...
Axure统计图元件库包括饼图、条形图、折线图、柱状图、环形图、面积图
05-15
Axure统计图元件库包括饼图、条形图、折线图、柱状图、环形图、面积图
【Axure高保真原型】可视化环形图
最新发布
mushe93的博客
01-25 778
今天和大家可视化环形图的原型模板，，包括4种效果，移入变色在环形中部显示数据、移入变色在标签弹窗显示数据、移入放大在环形中部显示数据、移入放大在标签弹窗显示数据。这个原型是用Axure原生元件制作的，所以不需要联网或者调用外部图表……具体效果可以打开下方原型地址体验或者点击下方视频观看
Axure微信高保真原型设计.zip
05-04
本文将深入探讨“Axure微信高保真原型设计”这一主题，解析其背后的IT知识点。 首先，我们要理解什么是Axure。Axure是一款强大的交互原型设计工具，广泛用于创建网页和移动应用的线框图、原型和规格说明。通过Axure...
Axure|共19款APP精美原型高低保真rp源文件（涵盖全面）.zip
12-12
高保真原型通常用于详细展示UI设计，包括颜色、字体、图标等元素，而低保真原型则更注重功能和流程。这些原型文件涵盖了高低保真两种，可以帮助设计者在不同阶段进行迭代和验证。 3. **外卖电商APP原型** 这类...
Axure 微信高保真原型图：验证码登录.docx
05-30
Axure 微信高保真原型图：验证码登录 Axure 微信高保真原型图：验证码登录是指使用 Axure 工具创建的微信验证码登录原型图。该原型图主要分为三个页面：第一个验证码页面，第二个拼图页面，第三个验证码页面二。...
Axure 微信高保真原型图——键盘输入.docx
05-30
Axure 微信高保真原型图——键盘输入 Axure 微信高保真原型图——键盘输入是微信登录验证码登录系列的一部分，本文将详细讲解模拟键盘输入的实现过程。 一、交互原理讲解 1. 输入讲解：通过 Axure，点击字母按钮...
axure通用元件库 Pc、Web端原型图组件库高保真.zip
12-11
总结来说，“axure通用元件库 Pc、Web端原型图组件库高保真.zip”是一个强大的设计资源，它为Axure用户提供了一个丰富且高质量的组件集合，方便快速构建高保真原型，提升设计质量和效率。无论你是个人设计师还是团队...
JavaScript画图折线图（区域图）、柱状图（条状图）、散点图（气泡图）、K线图、饼图（环形图） 雷达图（填充雷达图）。。。
03-01
商业级数据图表，它是一个纯JavaScript的图标库，兼容绝大部分的浏览器，底层依赖轻量级的canvas类库ZRender，提供直观，生动，可交互，可高度个性化定制的数据可视化图表。创新的拖拽重计算、数据视图、值域漫游等特性大大增强了用户体验，赋予了用户对数据进行挖掘、整合的能力。 折线图（区域图）、柱状图（条状图）、散点图（气泡图）、K线图、饼图（环形图） 雷达图（填充雷达图）、和弦图、力导向布局图、地图、仪表盘、漏斗图、事件河流图等12类图表
Axure画环形进度条
布道者
07-12 1444
1.将椭圆高度、宽度设置为300，大小可由自己设置 2.将矩形的右下角的点与圆心重合，然后点击去除 3.重复步骤，画出 4.加入BUTTON按钮，，预期结果： 
Axure8环形进度条原型制作
Miracle1203的博客
10-21 471
实现效果： 1首先拖入一个椭圆形，高度宽度设成250.在拖入一个矩形高度宽度设成140，如图叠在一起，在样式中选择去除 2.再拖入一个椭圆形，长度宽度设成220.如图叠在一起，在样式中选择去除，得到图形如下 3.再拖入椭圆形和矩形叠在一起去除取半圆，设置半圆的高15宽10，在缩放处选择300%，有利于半圆对齐，再填充灰色，去边框，组合 3 ...
Axure8制作环形进度条
wangyi123123的博客
08-19 1343
Axure8制作环形进度条 参考链接：https://mbd.baidu.com/ma/s/m9GpqH34 1.元件制作 （1） 拖入1个圆形控件，设置边框色，背景色都为青绿色。 （2）拖入一个小圆形控件，设置边框色，背景色都为白色，与大圆圆心重合。 ​ （3）裁剪获得空心圆。同时选中大圆小圆右键 （4）裁剪获得半空心圆，拖进来一个矩形，压住一半空心圆，同时选中右键。 （5）获得半空心圆后，复制一个，然后右键->改变形状->水平翻转，得到另半边空心圆。 2.元件及元件摆放说明 （
【Axure高保真原型】3D环形图_移入显示数据标签
mushe93的博客
11-20 190
今天和大家分享3D环形图_移入显示数据标签的原型模板，鼠标移入环形区域时，对应区域会变绿，可以查看该区域对应的项目、数据和占比，这个原型模板是用Axure原生元件制作的，所以无需联网，而且可以自由修改样式、交互等内容，具体效果可以打开下方原型地址体验或者点击下方视频观看
[原型设计]Axure8制作圆形旋转加载进度环和百分比效果
shuytu
11-13 6610
1、新建Axure RP文件，取名“Axure制作圆形旋转加载进度环和百分比效果”,效果图如下 2、拖入1个圆形控件，设置边框色，背景色都为蓝色，大小200px*200px。 3、拖入一个小圆形控件，设置边框色，背景色都为白色，大小150px*150px，与大圆圆心重合。 4、同时选中大圆和小圆，单击右键，Transform Shape——
Axure微信验证码登录高保真原型设计详解
Axure文档"微信高保真原型图：验证码登录"详细介绍了如何使用Axure工具创建一个模拟微信验证码登录过程的原型设计。该文档涉及的主要内容包括： 1. 流程图与分页演示：文档首先提供了一个完整的流程图，概述了整个...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

梓贤Vigo

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值