10+年产品经理聊聊产品、测测产品,产品人交流学习成长平台,按 Ctrl+D 收藏我们
留言板 小程序 交流群 关于我

苏米客

  • 首页
  • AIGC
    • AI最新动态
    • AI学习教程
    • AI工具集合
    • AI产品百科
    • AI编程开发
  • Axure
    • Axure动态
    • Axure教程
  • 产品
    • 用户体验
    • 产品设计
    • 苏米杂谈
  • 资源
    • 产品UI组件库
    • 开源图标库
    • 中后台框架
  • 书单
    • AI书籍
    • 用户体验
    • UI视觉
    • 产品研究
    • 其他类型
  • 下载
    • Axure组件
    • Axure原型
    • 文档报告
    • 素材资源
  • 登录
  • 首页
  • AIGC
    • AI最新动态
    • AI学习教程
    • AI工具集合
    • AI产品百科
    • AI编程开发
  • Axure
    • Axure动态
    • Axure教程
  • 产品
    • 用户体验
    • 产品设计
    • 苏米杂谈
  • 资源
    • 产品UI组件库
    • 开源图标库
    • 中后台框架
  • 书单
    • AI书籍
    • 用户体验
    • UI视觉
    • 产品研究
    • 其他类型
  • 下载
    • Axure组件
    • Axure原型
    • 文档报告
    • 素材资源

在Axure RP中快速创建可视化统计图,加载图表元件库 Axhub Charts

11月前 1519 0

Axhub Charts是基于Echarts和Antv的图表元件库,主要是应用在Axure原型设计

Echarts:https://echarts.baidu.com,源于百度的开源的可视化解决方案

Antv:https://antv.alipay.com/zh-cn/index.html,源于蚂蚁金服的数据可视化解决方案

下载 Axhub Charts 元件库rplib文件 :

点击下载

使用Axhub Charts元件库可在Axure RP中快速创建可视化统计图;

可创建的可视化统计图有折线图、柱状图、堆叠柱状图、条形图、堆叠条形图、面积图、饼图、环形图、漏斗图、甘特图、散点图等。

本节依旧以Axure RP 9 版本为例, Axure RP 8操作略微有些差异,但大部分一致;

1.添加Axhub Charts元件库

在Axure RP 9中,切换至【元件】按如下操作,点击> + 号,选择已下载好的AxhubCharts.rplib 库文件;

载入成功后,即可看到该元件库支持的统计图。

2.添加可视化统计图

本文提供柱状图操作实例,其他图形以此类推。

把柱状图元件拖进画布中,即可完成柱状图的添加

接着切换至【概要】页面中可以看出柱形图元件由一个矩形和两个中继器组成。其中:

anhub-column-data(中继器)负责控制柱形图展示的数据情况;

anhub-column-config(中继器)负责控制柱形图展示的外观情况;

点击anhub-column-data(中继器),在【数据】中调整需要展示的数据结果。

点击anhub-column-config(中继器),在【数据】中调整需要改变柱形图外观的参数。

如果需要改变X轴数据为中心,则可以改变【month】一列的值;

如果需要改变柱形图的图例为中文,则可改变【formHeader】一行的【value】值;

改变图例命名前后对比图如下:

声明:本站原创文章文字版权归本站所有,转载务必注明作者和出处;本站转载文章仅仅代表原作者观点,不代表本站立场,图文版权归原作者所有。如有侵权,请联系我们删除。
#AxhubCharts #图表元件库 #AxureRP 
收藏 1
推荐阅读
  • Axure入门教程:将Adobe XD设计导入Axure
  • 组件库Fontawesome字体图标使用说明
  • Axure入门教程:如何用AxureRP做产品的需求管理
  • Axure RP 教程:动态面板之表单多级联动效果制作
  • Axure RP 教程:如何快速创建全局和页面辅助线,原型辅助线的原型高效必备技能
评论 (0)
请登录后发表评论
分类精选
Axure RP 教程:Axure中实现多组条件判断情形(Case)的使用和设置
1686 9月前
Axure RP 教程:制作滚动字幕效果,文字滚动的动态效果
1612 11月前
Axure RP 教程:Axure中继器的增、删、改、查操作教程
1594 11月前
Axure RP 教程:快速制作页面跳转,Axure RP跳转链接教程
1558 11月前
Axure RP 教程:Axure 预览与发布生成HTML文件
1549 11月前
Axure入门教程:将Adobe XD设计导入Axure
1521 11月前
在Axure RP中快速创建可视化统计图,加载图表元件库 Axhub Charts
1520 11月前
Axure RP 教程:Axure中继器中按钮文字添加页面链接或外链设置方法
1514 11月前
Axture元件库教程(二):一键复制Iconfont图标到Axure
1503 11月前
Axure RP 无法发布预览页面问题?无法正常预览页面怎么办?怎么解决?
1348 11月前

文章目录

关注「苏米客」公众号

订阅推送更及时,手机查看更方便
分类排行
1 Axure PR进阶教程:输入数值控制滑块与拖动滑块动态显示数值交互设计
2 Axure RP 教程:如何导入阿里云Datav地图,实现Axure地图可视化交互效果
3 Axure RP 教程:Axure视频播放功能,高保真原型实现视频交互的详细操作步骤
4 Axure RP 教程:动态面板之表单多级联动效果制作
5 Axure RP 教程:动态面板之Tab标签导航页面切换效果制作
6 Axure RP 教程:动态面板之水平拖动及展开收起如何实现
7 Axure RP 教程:元件操作之快速创建单选按钮组或选项组
8 Axure RP 教程:常用样式之元件样式管理器
9 Axure RP 教程:常用样式之页面样式管理器
10 Axure RP 教程:Axure 支持哪些类型的页面布局,如何创建自定义布局
©2015-2024 苏米客XMSUMI 版权所有 · WWW.XMSUMI.COM 闽ICP备14005900号-6
免费影视APP 花式玩客 免费字体下载 产品经理导航 Axure RP 10 免费Axure模板 Axure原型设计 Axure元件库下载 原创Axure模板 申请友联