千锋教育-做有情怀、有良心、有品质的职业教育机构

当前位置:首页  >  IT面试题  >  html5面试题  >  正文

场景题:绘制曲线

来源:千锋教育
作者:wjy
关键词: 北京 大连
2022-09-26
分享

  题目内容:

  场景:创建简易的绘图工具,实现控制画布上的四个锚点的拖拽修改已经绘制的曲线图,通过注释实时显示锚点的具体实时坐标,并通过反色清楚的显示控制点的位置 要求:

场景题:绘制曲线

  1. 创建一个512*512的canvas画布

  2. 在该画布上任意创建四个锚点,使用贝塞尔曲线进行连接

  3. 可在画布上自由拖拽上面的锚点,从而实现贝塞尔曲线的联动,每个点都有一个跟随点移动的注释(文字+箭头),说明该点的坐标

  4.在此基础上,实现一个黑白渐变色的背景,然后在锚点周围20个像素内,将锚点所处的背景作反色,突出锚点的显示

声明:本站稿件版权均属千锋教育所有,未经许可不得擅自转载。

相关推荐

  • 小程序怎么获取手机号 准备一个button组件, 将button组件open-type的值设置为getPhoneNumber,当用户点击并同意之后,可以通过 bindgetphonenumber事件回调获取到动态令牌code; Page({ getPhoneNumber (e) { console.log(e.detail.code) } }) 接着把code传到开发者后台,并在开发者后台调用微信后台提供的phonenumber.getPhoneNumber接口
  • 小程序的兼容问题有哪些 - 1,ios下的zIndex层级问题,主要发生在iphone7和iphoneX下绝对定位必须有一个共同的父元素。 - 2,左右边框不生效,当边框的宽度设置为奇数的时候,可能会不生效。解决方法:将宽度设置为偶数的时候,在ios下就可以解决
  • 小程序嵌入H5页面怎么做 - 解决方式 :web-view webview 指向网页的链接。可打开关联的公众号的文章,其它网页需登录小程序管理后台配置业务域名。 - 具体实现步骤: - 登陆小程序管理后台, 配置服务器域名( h5页面所在的域名 ) - 在小程序里面嵌入h5
  • 如果小程序版本更新了怎么通知用户 当小程序发布新的版本后,用户如果之前访问过该小程序,通过已打开的小程序进入(未手动删除),则会弹出提示,提醒用户更新新的版本。用户点击确定就可以自动重启更新,点击取消则关闭弹窗,不再更新. 核心步骤
  • 小程序生命周期 onReady生命周期函数 --监听页面初次渲染完成onShow生命周期函数 --监听页面显示onHide生命周期函数 --监听页面隐藏onUnload生命周期函数 --监听页面卸载onPullDownRefresh页面相关事件处理函数
  • echarts是什么,怎么用 echarts是一个基于JavaScript的开源可视化图表库,可以流畅的运行在PC和移动设备上,兼容绝大部分的浏览器(IE9/10/11,Chrome,Firefox,Safari等),底层依赖矢量图形库ZRender,提供20 多种图表和十几种组件,支持Canvas、SVG双引擎并能一键切换,让移动端渲染更加流畅echarts源自百度