《H5教程|如何零基础在H5中实现数...

  • 经验类型教程
  • 经验属性原创文章
  • 经验版权署名-非商业性使用-禁止演绎
2677 1 2 2019-11-27

数据可视化主要旨在借助于图形化手段,清晰有效地传达与沟通信息。今天,我们使用的H5工具是Epub360,下面我们来介绍实现数据图表可视化效果的方法,零基础的你们准备好了吗?

首先,我们先来介绍一下数据图表组件。

数据图表组件简介:

数据图表组件是一款用于数据可视化动态展示的组件,满足各行业数据可视化快速设计需求,借助H5及时传播。

应用场景多为企业月度、季度、年度业绩报表等数据展示;帮助各媒体行业,特别是数据新闻制作更快呈现,实现图、文、音视频、可视化数据在1个H5工具内完成。另,借助意派Epub360的自由定义页面,将适应更多设备场景展示。

目前数据图表组件支持柱状图、折线图、饼状图、散点图、条形图5种图表类型。


体验地址>>>>>www.epub360.com



组件添加及设置:

1.在高级表单——数据应用组件分类下找到数据图表组件,点击数据图表组件,添加到画布中;


2.双击组件,调出数据图表组件设置面板;


3.左侧是数据图表的样式展示,可以实时预览效果,右侧面板中的三个设置点击进行切换,设置这一项用于修改数据图表的颜色、文字大小、动态效果等显示效果;


4.右侧面板中的数据是一个类似于Excel的界面,但是比较简单,可以在里面添加我们所需要的数据,最多添加多少行、多少列,暂时没哟限制。鼠标右键单击可以弹出基本的表格操作面板;


5.如果Excel的数据过大或者过小,会造成图表显示不够美观;


6.这时可以通过设置X轴、Y轴的最大最小值来解决,如图:


Epub360 数据图表组件后期将会对该功能继续优化,欢迎提出更多问题建议~

Powered by Froala Editor

全部评论:1

  • justindesign

    2019-12-12 10:11

    @UI-GHH: 大体上分为代码开发和工具制作。因为代码开发成本效率比较高,像网易、阿里、腾讯项目一般为代码开发,不差钱培养一批优秀的程序猿,但是对于中小型公司,预算有限,省时又省钱,目前专业的H5工具,例如Epub360,我用了三四年,几乎所有的效果功能都可以实现,那何必再去招募程序开发呢?当然,如果公司成本hold住,这一点可忽略~浅陋观点,仅做参考。

  • UI-GHH

    2019-12-03 11:00

    你好,小白想请教个问题,你是专业从事h5开发的工程师吗?现在开发H5宣传页面,都是使用开发工具制作的吗?没有完全使用代码开发的吗?

更多作品

发表评论

取消

点击右上角
分享给朋友吧

分享到

取消

每人每天仅限5票,快给你心仪的作品鼓励的一票。

投票