用canvas绘制线条和填充，fill()和stroke()调用顺序直接影响绘制的结构

先调用stroke在调用fill，绘制的效果看上去lineWidth只绘制出来一半，还以为是个大问题。

 <!DOCTYPE HTML>

 <html>

 <body>

 <canvas id="myCanvas" width=400 height=300>your browser does not support the canvas tag </canvas>

 <script type="text/javascript">

 var canvas=document.getElementById('myCanvas');

 var ctx=canvas.getContext('2d');

 ctx.lineWidth=10;

 ctx.fillStyle='#FF0000';

 ctx.strokeStyle='#000000';

 ctx.rect(5,5,80,100);

 ctx.stroke();

 ctx.fill();

 </script>

 </body>

 </html>

先调用fill在调用stroke，直接就解决了上面绘制的lineWidth只绘制一半的问题！

 <!DOCTYPE HTML>

 <html>

 <body>

 <canvas id="myCanvas" width=400 height=300>your browser does not support the canvas tag </canvas>

 <script type="text/javascript">

 var canvas=document.getElementById('myCanvas');

 var ctx=canvas.getContext('2d');

 ctx.lineWidth=10;

 ctx.fillStyle='#FF0000';

 ctx.strokeStyle='#000000';

 ctx.rect(5,5,80,100);

 ctx.fill();

 ctx.stroke();

 </script>

 </body>

 </html>

stroke和fill顺序对绘图的影响的更多相关文章

  1. iOS 2D绘图 (Quartz2D)之路径(stroke，fill，clip，subpath,blend)

    像往常一样 这个系列的博客是跟着大神的脚步来的.按照往例 在此贴出原博客的出处: http://blog.csdn.net/hello_hwc?viewmode=list我对大神的崇拜之情 如滔滔江水 ...

  2. SQL Server中多表连接时驱动顺序对性能的影响

    本文出处:http://www.cnblogs.com/wy123/p/7106861.html (保留出处并非什么原创作品权利,本人拙作还远远达不到,仅仅是为了链接到原文,因为后续对可能存在的一些错 ...

  3. where的顺序对运行的影响--无影响

    2.表连接的时候,大表与小表的顺序是哪个在前.3.在多表连接时,是表与表先连接起来,再执行对单表的限制条件where条件:还是先执行单表的限制where条件,再进行表连接?4.多表连接时,如4个表,我 ...

  4. 关于数据库优化2——关于表的连接顺序，和where子句的前后顺序，是否会影响到sql的执行效率问题

    有好多时候,我们常听别人说大表在前,小表在后,包括现在好多百度出来的靠前的答案都有说数据库是从右到左加载的,所以from语句最后关联的那张表会先被处理.如果三表交叉,就选择交叉表来作为基础表.等等一些 ...

  5. SQL where 条件顺序对性能的影响有哪些

    经常有人问到oracle中的Where子句的条件书写顺序是否对SQL性能有影响,我的直觉是没有影响,因为如果这个顺序有影响,Oracle应该早就能够做到自动优化,但一直没有关于这方面的确凿证据.在网上 ...

  6. 优化 : Oracle数据库Where条件执行顺序 及Where子句的条件顺序对性能的影响

    .Oracle数据库Where条件执行顺序: 由于SQL优化起来比较复杂,并且还会受环境限制,在开发过程中,写SQL必须必须要遵循以下几点的原则: 1.ORACLE采用自下而上的顺序解析WHERE子句 ...

  7. SQL Server在执行SQL语句时，表之间驱动顺序对性能的影响

    环境:SQL Server2012 SP3 企业版,开发服务器,并没有什么负载,全库索引统一Rebuild过 经反复执行验证过, 不算太复杂的SQL(存储过程中代入参数抠出来的SQL代码) 默认情况下 ...

  8. OpenGL中旋转平移缩放等变换的顺序对模型的影响

    l 前提: 0x01. 假设绘制顶点的语句为Draw Array,变换的语句(旋转.平移.缩放)为M,而 M0; M1; M2; Draw Array; 则称对Array先进行M2再进行M1.M0 0 ...

  9. SQL 两表关联查询 where 条件中等号两端字段顺序对效率的影响

    现有两表A(大).B(小)作关联查询,SQL语句如下: SQL1:select * from A,B where A.id = B.id SQL2:select * from A,B where B. ...

随机推荐

  1. ionic4 refresh组件位置变更：Ignored attempt to cancel a touchmove event with cancelable=false

    io3 中 refresh组件位置可不定: io4 中 须置顶,否则报错,此外complete方法的调用位置改为target属性 参考:https://github.com/ionic-team/io ...

  2. Qt 学习之路 2（60）：使用 DOM 处理 XML

    Qt 学习之路 2(60):使用 DOM 处理 XML  豆子  2013年8月3日  Qt 学习之路 2  9条评论 DOM 是由 W3C 提出的一种处理 XML 文档的标准接口.Qt 实现了 DO ...

  3. Jmeter拓展插件可查看和lr一样的图形结果

    利用插件可通过图形直观查看CPU.Memory等的运行情况 1. JmeterPlugins.jar插件下载地址:http://jmeter-plugins.org/downloads/all 下载并 ...

  4. mysql id_logfile 日志

    ib_logfile 文件原理 ib_logfile0 是innodb中事务日志,记录系统的回滚,重做日志,记录的是文件的物理更改,存放位置my.ini 中的 datadir="D:\php ...

  5. C# 关于Grid下动态删除行列的操作

    假设我们有以下布局 <Grid x:Name="Grid" ShowGridLines="True"> <Grid.RowDefinition ...

  6. Tyvj - 1305 单调队列优化dp

    今天有点头痛就不写具体细节了,贴完走人 #include<iostream> #include<algorithm> #include<cstdio> #inclu ...

  7. Win10如何新建用户怎么添加新账户

    https://jingyan.baidu.com/article/25648fc162d5899190fd0069.html 很多朋友都是安装完Windows10系统后,直接使用超级管理员账号登录系 ...

  8. 给json格式化的一个小工具

    var glob = require("glob") // options is optional var fs=require("fs") glob(&quo ...

  9. libevent 同性恋 讲解

    https://aceld.gitbooks.io/libevent/content/25hong_fa_mo_5f0f_md.html github 这url 干活比较好 https://githu ...

  10. APP在实际开发中应注意的关键点

    在APP开发过程中,开发者比较注重的是功能模块的实现,从而忽略了APP的设计问题,特别是企业开发APP,但是,APP设计是APP开发中非常重要的一个环节,APP界面设计直接影响到APP用户的感官,因此 ...