python绘制坐标系_借助Python Turtle,了解计算机绘图的坐标系

原标题:借助Python Turtle,了解计算机绘图的坐标系

学习Python turtle,你不可避免地要和坐标系打交道。在计算机程序中,坐标系是怎么表现的。《Python-Turtle图形编程入门》课程第二课“设置画布”介绍了Python中的坐标系,这篇文章中,牛毅昕老师将拓展一步,认识计算机绘图中的坐标系。

坐标系相信大家都不陌生,我们学习数学时都会接触坐标系的概念。下图就是我们最常用的笛卡尔坐标系。

8747efb976a74cc8bd60ea7df7a4bca7.png

坐标系的类型有很多,如地球上的经纬度,平面中的X轴,Y中,还有3D中的Z轴,这些我们都叫坐标系。同时,坐标系也是计算机绘图的核心概念,在计算机屏幕上,画面是由一个个像素组合而成的,坐标系会给图形中的每个像素点都提供一个精确的位置。

在计算机的发展当中,涌现了很多很多的带有绘图功能的程序,例如常用的绘图软件Photoshop,CAD, illustrator等,它们通过坐标系确定每一个点的颜色和位置。

ae46cfb8946b4e72b82aaeaa4d04a0c2.jpeg

Photoshop中课程图片,每个像素都对应着独一的坐标

除了绘图软件,对于游戏来说坐标系也很重要。除了最早期的MUD(文字类网络游戏)以外,只要是有图形界面的游戏,坐标系和坐标系定位都是这些游戏的重要组成部分,从地图的加载到人物模型,在到打击判定等等,这一切的一切都要以坐标为基础。

最早有记录的电子游戏诞生于1952年,为井字棋游戏(Tic-Tac-Toe)

0f3225f08867423ea93ab89b29c920a0.jpeg

井字棋游戏就采用坐标来定位每一个格子,这种方法一直沿用至今。

e02eb611afee4ec89210022c7ffab2d4.png

例如在仙剑奇侠传中,在很多的地图上大家都可以看见类似这种方格,这种方格除了早当时除了起到视觉效果以外,另一个最大的作用就是用坐标来定位和记录位置了。

db8dafe97c9c4187b6e507d86488ad22.jpeg

在星际争霸中,大家直接看不出地图的格子,当我们用鼠标选中操作角色的时候,或者是用鼠标右键点击地图上移动的时候,都会出现一个绿色的圆框,这个其实也 是坐标系定位的体现。

在早期游戏中,我们也能看出画面中的小区块的排布,也是简单的绘图坐标系的展现。

0f3e21bc0c244fff9999468a08b14095.jpeg

恶魔城FC版

在我的世界(Minecraft)游戏中,坐标系就升级到了三维。除了X轴和Y轴以外,多一个Z轴

1e08802710b64e2281f6e06ccbcddf9e.jpeg

077c09ee176441888449873ad8a0fdce.jpeg

通过观察游戏画面,我们可以直观的感受到画面绘图的坐标体现。接下来,我们借助Python Turtle,更进一步了解坐标系与计算机绘图的结合应用。

Python Turtle中使用2种坐标系:屏幕坐标系和笛卡尔坐标系。

屏幕坐标系:

电脑或者手机屏幕的坐标系,单位为像素。电脑坐标系的X轴从左往右递增,Y轴从上往下递增。即:屏幕的最左上方可见像素的坐标是(0,0)。

X、Y的可视值域取决于你的显示器分辨率。以1024×768的分辨率为例,X的值就在0~1024之间,Y的值在0~768之间,只要超出这个范围,我们就看不见了,当然 这样也没有什么意义了。

429a4bac5dcd45748c587b0191fbebac.png

图中的代码,在setup方法中指定了窗口的宽和高,然后起始X和起始Y都是0,运行的时候这个窗口将会出现在大家计算机屏幕的左上角,大家可以更改后2个参数,看看窗口启动的时候发生的位置变化。所以屏幕坐标系的原点(0,0)是从左上角开始的,这一点上跟笛卡尔坐标系有所差别。

笛卡尔坐标系:

在创建GUI窗口的的还时候,使用的是屏幕坐标系,那么窗口创建好了以后,我们开始绘图的时候,使用的是否还是屏幕坐标系呢?我们来看图说话:

ff97103fdc7344708999bae7e61d70eb.png

相信看了科技学堂Python Turtle课程视频的同学应该清楚这三行代码能出现什么效果了吧。其实很简单,就是在屏幕上画一条长度为100px的直线。那么这条直线会使用哪种坐标系呢?

5901889e93404a448af24018f1df0c99.png

在画这条线的时候,我并没有指定起始的X和Y,那么默认就是0,0但是根据刚才的效果来看,这条线应该是从左上角开始画的,为什么会出现在中间呢?

在这里,需要大家注意的是,GUI程序分为2个层(仅限与2D ,3D不在我们本次的讨论之内),第一层,就是我们第一次代码创建的的窗口。这个窗口的坐标系使用的是屏幕坐标系,也就是X,Y的原点是在屏幕左上角。第二层,也就是我们画线的这一层,由于他的范围是在我们创建的这个窗口之内的,并不受限与屏幕,所以第二层的坐标系使用的就是数学中的笛卡尔坐标系。

我们将代码修改一下,这样大家能看的更直观:

147a397b716648849ba54bd54735bf12.png

以上的代码也非常简单,让海龟绘制一个三角形:

7f1f95d3d6694b1791d5d6a91fff7c53.png

由于Turtle可以看到绘制过程,所以在运行代码的话我们会发现海龟是从这个窗口的中间开始绘制的。由于默认是从左往右画的,所以图形会出现在窗口的右边。如果我们在代码中我们加入了turtle.pos方法来打印当前海龟的坐标,会得到下面的结果:

a13fd70698424e7da7171a86618a4f44.png

从结果里我们可以看出,在程序刚运行的时候海龟的坐标确实是原点(0,0)那么这个时候原点就是在这个窗口的中间了。所以在绘制的时候所使用的坐标就是数学中的笛卡尔坐标,这个跟我们创建这个GUI程序的时候的坐标是有所不同的。我们在来看一个稍微复杂的例子:

6d7485634fda4260958dec19c2f78c16.png

绘制五角星,大家如果运行程序的话会发现,也是从窗口的中间开始画的:

e3341daf06154752938b4308801d89be.png

并且我们来看一下输出的坐标

d089fe6c13294b9bb5661a793d7e8f1a.png

最开始的时候也是0,0 说明原点确实是在这个窗口的中间 。

通过这2个图形的案例,相信大家能区分开来了。在创建GUI程序的时候使用的是屏幕坐标系,原点(0,0)在屏幕的左上角,而我们在这个程序上开始绘制图形的时候,坐标的原点就会编程窗口的中间了,也就是开始使用数学中的笛卡尔坐标系了。

那么坐标系的定位功能如何来体现呢?

23432c30df5449e7a31a872b506d22af.png

这是使用turtle绘制的国际象棋棋盘的例子,大家可以看到一格一格的非常明显,如果我们需要完善这个国际象棋的游戏的画,落子只需要通过坐标来判断是否在格子之内就可以了。这样一来通过坐标我们就可以实现游戏理的定位功能了。我们用turtle绘制棋盘的过程就和游戏中棋盘绘制的机制很接近了。

现在是不是对程序中的坐标有一点了解了呢?如果对Turtle或者Python有兴趣,点击下方小程序报名《 Python-Turtle图形编程入门》课程吧。返回搜狐,查看更多

责任编辑:

  • 1
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值