极客观点
项目管理
HarmonyOS
最近业务当中碰到以上交互设计。用滑块来控制波形图的动画，每种类型的波形起伏不一样代表用户选择的风险承受程度不一样，起伏越大代表用户的风险承受程度越高。最开始的思路是用canvas来实现，有点类似于三角函数sin的一个示例图。但是后面仔细想想其实与三角函数的图例相差还是挺大的。请问各位大神有什么样好的思路和想法，谢谢。
自己写canvas多麻烦，找个带过度动画的图表库，用里面的面积图，然后往设计图上靠。
比图Ant Design Charts里有一个迷你面积图，跟你的需求类似
这个是根据G2Plot封装的react图表库，你可以用这个G2Plot封装成vue的
再根据滑块改改图表的对应数据就行了
撰写回答
你尚未登录，登录后可以
- 和开发者交流问题的细节
- 关注并接收问题和回答的更新提醒
- 参与内容的编辑和改进，让解决方法与时俱进
推荐问题
js 如何将Key属性相同的放在同一个数组？
{代码...} 说明：id和name是动态的，有可能后台返回的是age和school,不是固定id和name想要的结果是; {代码...}10 回答11.7k 阅读
前端代码更新如何通知用户刷新页面？
前端代码更新如何通知用户刷新页面？2 回答3.2k 阅读✓ 已解决
字节的 trae AI IDE 不支持类似 vscode 的 ssh remote 远程开发怎么办？
尝试一下字节的 trae AI IDE ([链接])安装后导入 vscode 的配置，好像一起把 vscode 的插件也导入了也能看到 vscode 之前配置的 ssh remote 但是连不上看到「输出」如下⬇️ {代码...}2 回答4.3k 阅读✓ 已解决
css布局怎么保证右边一直在可视范围内？
如下：灰色和红色的高度都不确定，怎么保证左边高度太高需要滚动时右边一直能在可视范围内？ {代码...}5 回答2.2k 阅读
Element Plus表格组件如何呈现复杂布局如图？
Element Plus的table表格如何实现下图的表格效果，element的表格看起来是一列一列的，好像没办法实现这种效果，如果要实现这种图片效果需要如何做呢4 回答4.6k 阅读✓ 已解决
请问开发React Native，一般是推荐哪个主流的UI库呢？
请问开发React Native，一般是推荐哪个主流的UI库呢？我们知道React有antd，但是React Native的话好像React Native Mobile RN不是最主流的。3 回答1.9k 阅读✓ 已解决
多个vue项目，后台接口都是一样的，每个vue项目的同一个页面都只是一小部分修改，怎样把公共的代码提出来复用？
比如：project1,project2项目的所有页面都是一样的，project1/src/a.vue和project2/src/a.vue只有几行代码不一样，可以通过判断处理，a.vue的其他代码怎么复用？4 回答2.1k 阅读✓ 已解决
看起来风险图是随着 x 变化的，定义好 x 对应的渲染输出，拖动就是改变 x ，每次拖动渲染就好了