html5使用canvas画一条线

   代码太简单了,就不废话了

  代码如下:

  var canvas=document.getElementById("canvas");

  //设置绘图环境

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

  //开启新路近

  cxt.beginPath();

  // 设置笔触的宽度

  cxt.lineWidth=10;

  //设置笔触的颜色

  cxt.strokeStyle="#00ff00";

  //设定笔触的位置

  cxt.moveTo(20,20);

  //设置移动的位置

  cxt.lineTo(100,20);

  //画线

  cxt.stroke();//这个时候的线已经出来了

  //关闭路径

  cxt.closePath();

  //凡事路径图形必须先开始路径,画完之后必须结束路径

时间: 2024-11-17 20:50:39

html5使用canvas画一条线的相关文章

用html5的canvas画时钟的问题

问题描述 用html5的canvas画时钟的问题 问题1: //初始化画布 context.save(); context.clearRect(00canvas.widthcanvas.height); context.translate(canvas.width/2canvas.height/2); context.scale(0.90.9); context.rotate(-Math.PI/2); context.save(); 初始化的时候加一句 context.rotate(-Math.

html5使用canvas画空心圆与实心圆

 <canvas id="canvas" width="500" height="500" style="background-color: yellow;"></canvas> 代码如下: var canvas=document.getElementById("canvas"); var cxt=canvas.getContext("2d"); //画一个空心圆

html5使用canvas画三角形

 <canvas id="canvas" width="500" height="500" style="background-color: yellow;"></canvas> 代码如下: var canvas=document.getElementById("canvas"); var cxt=canvas.getContext("2d"); cxt.begi

jFreeChart 时序图TimeSeries 如何在一条线上显示不同颜色

问题描述 如标题,本人正在用jFreeChart画时序图(TimeSeries),客户要求突出显示某线段,要使用不同颜色,就是在一条线上的不同线段人工设置不同颜色,哪位高手有做过相关的研究,请明示.在网上找了几天都没找到相应的方法,最接近的就是变背景颜色.第一次发贴,希望大家多支持,多帮助,先谢谢了!!因为本人初来,没啥分给,尽力了. 解决方案 解决方案二: 看来很少人这样做啊.解决方案三: 我也在找,没找到.但有一个方法,可以画多条线,这些线显示不同的颜色.

jfreechart 折线图多条线以及图例的设置

问题描述 1.在一个折线图中画3条线,有一条(SeriesA)是目标值target,另两条是实际数据(SeriesB,SeriesC)对于SeriesB.C要求在折点处显示出具体数据,对SeriesA则不显示.通过如下命令,该操作是对3条线都操作了lineandshaperenderer.setBaseItemLabelGenerator(newStandardCategoryItemLabelGenerator());lineandshaperenderer.setBaseItemLabels

canvas画的进度条,谁会?帮忙画个。

问题描述 canvas画的进度条,谁会?帮忙画个(如下图所示). 解决方案 发代码吧:<!DOCTYPE><html><head><meta charset="utf-8" /><title>无标题文档</title><style type="text/css">*{padding:0px; margin:0px;}html{height:100%;}body{height:100%

HTML5 canvas画带箭头的虚线

 本案例注意事项: 1.当你拖动箭头时 canvas里面线条绘制自动重新计算点. 2.canvas没有画虚线的api,因为对api不是很熟悉,所以就不献丑了,在网上找的. 3.箭头出来后 点击画布里面的任意点 箭头将延伸到该处,至于具体的应用 修改canvas的lineTo属性就能实现了. 4.具体的代码解释我写的比较清楚,修改箭头样式只需写过lineTo即可,非常简单. 效果如下: 代码如下: <!--程序说明: 作者:xue51 描述:该程序主要是通过exchange的支持在IE下面实现ca

用DrawLines画线,为什么整条线是首尾相连的?

问题描述 这是代码//画线publicvoidDrawMyLine(Graphicsarg,List<LineSTRUCT>WorldLines,/*线结构*/doubleScale,/*比例尺*/doubleXoWorld,/*世界坐标原点横坐标*/doubleYoWorld/*世界坐标原点纵坐标*/){using(Penp=newPen(Color.Yellow)){for(inti=0;i<WorldLines.Count;i++){Point[]temp=newPoint[Wor

winform问题 怎么可以在tablelayoutpanl上面用笔刷画条线

问题描述 winform问题怎么可以在tablelayoutpanl上面用笔刷画条线啊我画完的线全是在表格下方了,盖死也擦完了,完全显示不出来,有啥办法可以在表格的上方画,求助 解决方案 解决方案二:panel怎么又是表格的楼主表达明白点