摘要
Canvas是HTML5的特性元素之一,它不依赖插件,使用自带API即可完成图形图像的绘制和控制[1]。基于某安防视频监控系统,利用Canvas的图像处理特性,结合二维坐标的数学变换,实现了鼠标交互事件坐标与Canvas坐标对应;通过对入侵侦测区域动态绘制,拖拽和平移及越界侦测界限的旋转方法的研究,发现该技术绘图性能较好,坐标变换结果清晰可控,可以满足需求。
Canvas is one of the feature elements of HTML5 which is plug-in independent that can achieve drawing and control of graphics and images using built-in API.Using the image processing characteristics of Canvas,combined with two-dimensional mathematical transformation to achieve the correspondence between mouse interaction event coordinates and Canvas coordinates.By studying the dynamic rendering,drag,translation method of intrusion detection area,and rotation method of cross boundary detection,we find out that this technique has good drawing performance and the result of coordinate transformation is clear and controllable,and can meet the demand.
出处
《工业控制计算机》
2021年第9期53-54,共2页
Industrial Control Computer
关键词
CANVAS
坐标变换
动态绘制
canvas
coordinate transformation
dynamic rendering