计算机图形学
IT1995
每周个人笔记分享,欢迎广大网友查阅!
展开
-
Python文档阅读笔记-OpenCV中Match Shapes
OpenCV使用cv2.matchShapes()用来对比2个图像是否相似。返回值越低说明2张图片越相似。这个是基于hu-moment值算出来的。代码如下:import cv2import numpy as npimg1 = cv2.imread('star.jpg',0)img2 = cv2.imread('star2.jpg',0)ret, thresh = cv2.threshold(img1, 127, 255,0)ret, thresh2 = cv2.threshold(i原创 2021-09-21 20:56:15 · 2013 阅读 · 0 评论 -
Web前端笔记-2D图形平面内平移定位(two.js)
此处是在控制台中输入了window.mainPage.flyToPosition(-1000,500),他是经过平移过去的。整个坐标盘是这样的:这里使用two.bind(‘update’,function(frameCount){})用于平移时的绑定跟新,当平移结束后,使用two.unbind(‘update’);平移相关的代码:export function flyTo({x, y}){ waterWave(x, y); //计算出目前中心点与x,y坐标的差值 ..原创 2020-07-14 09:28:10 · 1351 阅读 · 0 评论 -
计算机图形学&Web前端笔记-定位并移动到指定坐标点(two.js理论及实现)
这里先演示下效果笔记毕竟这是给理论及实践的博文。当按下回车后会到场景600,600中画个圆并且浏览器会移动到场景600,600的位置,并且这个位置将会是圆心。同样,滑动滚轮进行放缩后,还是能进行定位的:这里来说下代码以及算法:这里的dot值存储了当前浏览器屏幕中心点对应在场景坐标点,参数x,y即为要定位的点,也就是屏幕中心会移动到的地方。等会说下getScreenOriginal()这个函数是怎么实现的。得到点后,把dot.x-x及dot.y-y乘以对应的...原创 2020-07-11 09:35:15 · 1372 阅读 · 0 评论 -
计算机图形学&Web前端笔记-浏览器中心点转场景坐标理论及实现(two.js)
实现的功能是这样的:输入window.mainPage.flyTo(xxx,xxx)后会在浏览器中心点画个圆心,使用鼠标及滚轮滚动后。再次运行:前一篇博文已经说了3*3变化矩阵实现图形放缩及平移,这里不再多谈,此处只记录下,将屏幕中心点坐标,转换为two.js的场景坐标点:这里的two.scene._matrix就是3*3的矩阵。cirX=(屏幕坐标X点-水平位移)/水平缩放cirY=(屏幕坐标Y点-垂直位移)/垂直缩放源码如下:...原创 2020-07-11 09:15:44 · 926 阅读 · 0 评论 -
计算机图形学&Web前端笔记-图形平移放缩原理及实现(two.js鼠标事件适用所有渲染)
在two.js中,只提供了svg渲染时的鼠标事件,而canvas和webgl并没有提供,这样就对本人造成了很大的困扰,因此学习了下计算机图形学相关的知识,实现了利用two.js绘图在canvas、svg、webgl渲染方式下,放缩或移动场景,还能使用鼠标对其进行点击交互。下面先演示下截图:点击绿色的矩形:从上面的图可以看出变色了。下面滚动滚轮及拖动下场景:同样点击刚刚那个矩形:还是可以被找到,并且改变颜色。下面先来说下2d图形中平移和放缩的原理(非常重..原创 2020-07-10 09:43:54 · 1431 阅读 · 0 评论 -
计算机图形几个小常识
构成图形的要素:几何要素:刻画形状的点、线、面、体等几何要素(如用数学方法描述的球体);非几何要素:反映物体表面属性或材质的灰度颜色等几何要素。表示图形的方法:1.点阵法:如bmp图,枚举出图形中所有的点来表示图形,强调图形由点构成,及其点的属性(颜色):像素图或图象。2.参数法:由图形的形状参数和属性参数来表示图形,简称图形;图形的参数:方程或分析表达式的系数,线段的端点坐标等。...原创 2018-09-27 16:59:16 · 4528 阅读 · 0 评论