返回列表 回复 发帖
谢谢各位老师,很专业,也很诚恳,真的是很高兴。
    如果不嫌冒昧的话,我在这里想和大家说几句推心置腹的话:几何画板作复变分形,体现出了老师们超凡卓越的能力,给人们展现的不仅仅是专业上的造诣,更多的是精神上的感动,至少我是被感动了。我总是觉得,老师们的业绩非常伟大,但也未免太过悲壮,几何画板玩分形,太辛苦了,希望老师们别怪罪,我说的是心里话。
    无论是几何画板还是复变分形,我真的不敢恭维自己。老师们越是包容我心里越是惭愧,跟着这个论坛学了这么多东西,怎么样才能对得起大家呢,开这个帖子的时候,我是犹豫了很久的:就 javascript 而言,深度和广度我都不具备,myzam 老师说得对,javascript 资料、教程和网站有很多,这是画板论坛,在这里专门讨论 javascript 是很不合时宜的。想了很久,最后大起胆子决定以“几何画板下的编程思考”为题来展开讨论,我知道这个祸闯大了,第一,对于我来说,题目太大了,编程的思维模式和行为习惯是个仁者见仁智者见智的问题。第二,这个题目不准确,让人以为是要对几何画板的功能进行编程模拟,在此特向大家道歉!
    我想把题目改成:“几何画板带给编程者的思考”,又觉得怪怪的,我的意思是:就编程来说,几何画板改变了我的行为习惯和思维模式。唉,总之,说来说去,结结吧吧的。哪位老师若有高见,请不吝赐教,谢谢了!
    实际上,脚本语言 javascript 是编程世界里的一个冤大头,对于不熟悉它的人来说,其问题出在“脚本”二字上,这里不展开,只是建议大家从认识上去掉“脚本”两个字,javascript 它就是一门纯粹的算法语言。对于熟悉它的人来说,建议看一下
    http://blog.csdn.net/uoyevoli/article/details/744915
和其他的有关文章。重复一下:javascript 作为 web 浏览器的前端脚本语言有着渗透网络世界所有领域的趋势。
    这个帖子之所以到现在要歇一下,就是希望得到各位老师的提携和指点,以使帖子朝着正确的方向走下去(如果可以的话)。
    上面贴出的那个“万花曲线规”,不是要讨论它的算法和实现,而是我们将要讨论更为高级的一种数据输入方式:屏幕输入。
    再次谢谢各位老师的包容和指教!!!
21# xklppp
论坛贵在论字上,也就是说你想怎么写就怎么写。你表达你的观点就行,别人接不接受是另一回事。大胆的写吧,总有人会看的。顶起。论坛要的就是百花齐放的效果。
21# xklppp
强烈支持!这才是取长补短,相得益彰!
资料收到,谢谢分享。
就软件界面而言,如果程序只涉及到文本,数据的输入有了前面介绍的两种方式即:键盘输入和鼠标输入(不是很准确)也可以应付一般的情况了。若需要绘图,则屏幕输入方式就显得非常重要。比方说:作复变分形时,在 mandbrot 集中寻找 julia 集,以及复分形的缩放,只用现有的输入方式会使得编程很是艰难。
    html5 用来处理图形图像的 canvas(画布) 元素,提供了一个二维接口 getContext('2d'),脚本语言就是通过这个接口来进行图形图像编程的。如:
      <canvas id=mCanvas width=300 height=200></canvas>
    这里放置了一个名为 mCanvas,宽高为 300,200 的画布,画布的默认状态是透明的。由于解释起来比较繁复和啰嗦,我都写入到了代码的注释里面。
New1.gif
2014-10-20 09:09

canvas 绘图功能非常强大,虽然目前只提供 2D 接口,但当下网上关于 canvas 3D 应用的视觉冲击力简直是不可思议。就 2D 来说,photoshop 的很多功能和特效都可以通过 javascript 不难的编程实现,在动画方面,flash 已经不能望其项背了。
    从程序运行效果来看,现有的参数输入方式,已经显得很笨拙,必须改善其性能,不过接下来的讨论会稍为艰难一点,谢谢大家的耐心!
htm0100.rar (1.45 KB)
很多人不太愿意搭理 javascript,它不就是个前端脚本工具吗,做大型网站有的是后台脚本语言,况且,从美工的角度来考虑,有了html 和 css 网页就可以做得很炫很酷,只是在设计页面交互功能和简单动画时用到 javascript 而已。
    其实,简单的说,html+css+javascript 可以做两个方面的事情,一是做网页,二是做软件。做网页不是这个帖子讨论的内容,我们要讨论的是如何使用 javascript 开发软件,太多的人没朝这方面去想,尽管现在 javascript 像个疯子一样在网络世界横行霸道,但也只是个敲边鼓,跑龙套的角色。
    就软件开发而言:第一,网络世界涌现出越来越多的在线软件,像雨后春笋。第二,这个帖子的开篇有提示过,“把文件的扩展名 .htm 改为 .hta 然后双击该文件,好了,我们竟然开发出了一个软件!”,之所以这样说,首先这是事实,其次,这可以成为我们学习 javascript 的动力,为我们学习 javascript 找到一个足以自豪的理由!
    如果有学习过可视化编程,如:vb,vc,c#,我们会发现:在工程项目的代码文件夹中,主要的有两类文件,一是算法代码,二是窗体代码,算法代码就是一般意义上的数据处理的程序代码,这一点,帖子在后面的复变分形中会涉及一些,真要讨论算法的话,得另外开个专题。为扣主题,本贴只讨论第二个方面的问题,窗体代码,也就是软件的界面代码,为方便见,以后我们把软件的界面就称之为窗体,也就是 html 的 body 元素。
    窗体代码主要作三件事:
    1.在窗体(body)中放置程序需要的对象(元素)。
    2.给各对象添加事件。
    3.编写事件的响应代码。
    这就是可视化编程要做的事情,我们就按照这种结构来编写我们的 javascript 代码。大家从前一个文件 htm0100.htm 中可以看得出来,窗体中只放置了五六个对象,其代码就显得有些拥挤不堪。事实上,它不像软件代码,只是个网页代码而已,并且会给后面的编程带来难以想象的麻烦。
    为此,我们编写一个名为 formSetup 的窗体函数,里面再嵌套 initComponents 放置对象,addEvent 添加事件和相应事件响应等函数,如是,我们的代码看起来像这个样子:
<script>
    function drawing()
    {
    }
    function formSetup()
    {
        var dataVerify=function(){}
        var addEvent=function(){}
        var initComponents=function(){}
    }
</script>
<body></body>
    没有新的内容,只是调整了一下结构。到现在,我们这才真的有点编程、做软件的意思了!
htm0101.rar (1.91 KB)
程序编到这里,仍然有两个问题:
    1.在输入框中输入数据后,须点击“绘图”按钮,输出窗口才会被刷新。
    2.几乎所有的绘图软件都提供了另外一种所见所得的数据输入方式,对于这种几何图形,更直观的方式是通过拖动图形的关键点来即时改变其形状,我们暂且称之为屏幕输入。
    这里先解决第一个问题,唯有如此,才能解决第二个问题。
    进一步调整代码:
<script>
    function Cycloid(){}
    function formSetup()
    {
        var RR,rr,pp;
        var drawing=function(){}
        var resetCycle=function(){}
        var dataVerify=function(){}
        var initComponents=function(){}
        var addEvent=function(){}
    }
</script>
New.gif
2014-10-20 09:09

这里,我们有一个基本的原则:除非万不得已,一般不在算法代码中处理窗体元素的各种数据,而算法中需要的各种参数,应该在窗体函数 formSetup 中预处理完毕后通过函数调用传递过去,开发大型软件时,这一点显得尤为重要。
htm0102.rar (1.42 KB)
27# xklppp


可以感觉到,楼主的不断研究,最终成就一个基于网页的几何画板,期待尽早实现。
金狐工作室:http://www.jinhu.me
由于代码是以万花曲线规为蓝本,代码中的 R、r、p 分别为定圆半径、动圆半径、笔孔。在程序输出窗口的画布中,设置了三个关键点:定圆圆心、动圆圆心、笔孔。为简化编程其中只有动圆圆心、笔孔被设置为可控屏幕点。R 由 mCanvas 的鼠标滚轮事件控制(这样安排主要是为了后面复分形的缩放留出代码空间),r、p 则通过 mCanvas 的鼠标拖拽来操纵。
    鼠标滚轮事件的代码很简单,和前面的一样,不再赘述。然而,鼠标拖拽却比较麻烦。一个鼠标拖拽动作包括三个事件:
    onmousedown 在对象上按下鼠标
    onmousemove 在对象上移动鼠标
      onmouseup 在对象上释放鼠标
    像大多数绘图软件的鼠标吸附(捕捉)功能一样,再加上一个吸附(捕捉)半径,就可以编写鼠标拖拽事件的程序代码了。
New1.gif
2014-10-21 09:35

    关于数据输入,讨论到这里就告一段落了。由于我们编写的是小程序,窗体设计中的诸如菜单栏、工具条、快捷按钮,属性面板,弹出窗口等等,本贴就不再涉及了。
    万花曲线规中还用到动画效果和多图层技术,这些我们将留在后续的复分形编程中讨论。
htm0103.rar (1.89 KB)
看不懂,但坚决支持!
无欲则刚!凡人不烦!
返回列表