`
wenlong342
  • 浏览: 62389 次
  • 性别: Icon_minigender_1
  • 来自: 沈阳
社区版块
存档分类
最新评论

简单描点曲线实例

    博客分类:
  • jsp
阅读更多
 

 

index.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>血压曲线图</title>
<style type="text/css">
.style1 {
    font-size: x-small;
}
.STYLE2 {
 font-family: "宋体";
 font-weight: bold;
}
</style>
</head>

<body>
<div align="center" class="STYLE2"><font size="2">血压情况实时曲线图</font>
  <span class="style1">
  <script type="text/javascript">
function makedot(x,y){ //画点函数
 document.write("<div style='height:1px;;left:"+x+"px;top:"+y+"px;width:1px;background:#f00;overflow:hidden'></div>")
}

/**
 函数功能:根据给定的圆心和半径画圆
 函数思路:根据半径及圆心坐标利用数学方法计算从0°到360°的每点的坐标,并画出来。
*/
function circle(x,y,r){ //(x,y)圆心,r半径
 var dotx,doty,radio;
 var Pi=Math.PI;
 makedot(x,y);
 for(var i=0;i<360;i+=0.5){
  radio=i*Pi/180;
  dotx=r*Math.cos(radio)+x;
  doty=r*Math.sin(radio)+y
  makedot(dotx,doty);
 }
}

/**
 函数功能:根据指点矩形左上角坐标及长宽绘制矩形。
 函数思路:根据左上坐标及长宽,计算横纵向边每点的坐标
*/
function rect(x,y,w,h){ //(x,y)左上角坐标,w,h 宽与高
 for(var i=0;i<w;i++){
  makedot(x+i,y);
  makedot(x+i,y+h);
 }
 for(var i=0;i<h;i++){
  makedot(x,y+i);
  makedot(x+w,y+i);
 }
}

/**
 函数功能:根据两点坐标画直线。
 函数思路:根据两点的坐标计算机斜率,然后根据第一个点坐标及斜率计算直线上所有点然后画线。垂直线特殊处理
*/
function line(x1,y1,x2,y2){
 var slope=(y2-y1)/(x2-x1); //斜率
 var diff=x2-x1;
 if(x1<x2){
  for(var i=0;i<diff;i++){
   makedot(x1+i,y1+slope*i);
  }
 }else if(x1>x2){
  for(var i=0;i>diff;i--){
   makedot(x1+i,y1+slope*i);
  }
 }else{ //画垂直线
  var temp=y2-y1;
  if(temp>0){
   for(var i=0;i<temp;i++){
    makedot(x1,y1+i);
   }
  }else{
   for(var i=0;i>temp;i--){
    makedot(x1,y1+i);
   }
  }
 }
}

/**
 函数功能:根据给定的三点坐标画三角形
 函数思路:直接利用画线函数画三条线即可
*/
function triangle(x1,y1,x2,y2,x3,y3){
 line(x1,y1,x2,y2);
 line(x2,y2,x3,y3);
 line(x1,y1,x3,y3);
}

/**
 函数功能:根据给定的一系列坐标点画多边形
 函数思路:循环读取坐标点,在当前坐标点与下一坐标点之间连线
*/
function polygon(){
 var args=arguments.length;
 if(args%2!=0) return -1;
 var realargs=args/2; //坐标个数
 for(var i=0;i<realargs-1;i++){
  line(arguments[i*2],arguments[i*2+1],arguments[i*2+2],arguments[i*2+3]);
 }
 line(arguments[i*2],arguments[i*2+1],arguments[0],arguments[1]);
}


function writeLan(){
 document.write("<div style=';left:199px;top:200px'>"+"0"+"</div>");
 document.write("<div style=';left:605px;top:200px'>"+"横坐标(时间)"+"</div>");
 document.write("<div style=';left:199px;top:15px'>"+"纵坐标(血压值)"+"</div>");
}
line(200,200,600,200);//x轴
line(240,200,240,193);//x轴刻度
line(280,200,280,193);//x轴刻度
line(320,200,320,193);//x轴刻度
line(360,200,360,193);//x轴刻度
line(400,200,400,193);//x轴刻度
line(440,200,440,193);//x轴刻度
line(480,200,480,193);//x轴刻度
line(520,200,520,193);//x轴刻度
line(560,200,560,193);//x轴刻度
line(200,180,207,180);//y轴刻度
line(200,160,207,160);//y轴刻度
line(200,140,207,140);//y轴刻度
line(200,120,207,120);//y轴刻度
line(200,100,207,100);//y轴刻度
line(200,80,207,80);//y轴刻度
line(200,60,207,60);//y轴刻度
line(200,40,207,40);//y轴刻度
line(200,200,200,20);//y轴刻度
line(200,200,220,180);//曲线1
line(220,180,240,150);//曲线2
line(240,150,500,100);//曲线3
line(500,100,600,40);//曲线4
writeLan();//文字
    </script>
    </span></div>
</body>

</html>

分享到:
评论

相关推荐

    易语言正弦曲线描点-易语言

    "易语言正弦曲线描点"是针对初学者的一个教学实例,旨在教授如何使用易语言来绘制正弦函数的曲线,并在曲线上描出特定的点。 在数学中,正弦曲线是一个周期性连续函数,表示为y = sin(x),其中x是角度,y是对应的...

    函数的图象(第2课时)教学设计.doc

    用描点法画出简单函数的图象,这包括确定自变量的取值进行列表,以及在坐标系中将点连成曲线。 教学难点: 1. 如何选取适当的自变量值进行列表,确保图象的准确度。 2. 从函数图象中分析函数的性质,如增减性、单调...

    炫彩界面-曲线图表-易语言

    在易语言中,可以利用图形绘制函数来构建曲线图表,如使用线性描点、二次曲线、贝塞尔曲线等方法。同时,结合颜色和标记,可以进一步增强图表的表现力。例如,通过改变线条颜色和宽度,可以突出关键时段或数据点;...

    catia齿轮画法全解.pdf

    (4)单击轮廓工具栏中的(样条曲线)工具,用描点法绘制如图 8.172 所示的曲线,描点法选点的多少将影响渐开线的准确程度,选择的点数可随意确定。 (5)使用《机械设计手册》中的渐开线函数表查阅并计算各点的极...

    反比例函数图像性质第一课时北师大版PPT学习教案.pptx

    反比例函数是初中数学中的一个重要概念,它与一次函数有着本质的区别。...在教学过程中,教师应引导学生运用列表描点的方法亲手绘制反比例函数的图像,以加深理解,并通过实例和练习来强化其应用能力。

    抛物线的简单几何性质教案全面版.pdf

    教学实例中,如已知抛物线关于\( x \)-轴对称,顶点在原点,并经过点\( M(2,2) \),可以设定标准方程为\( y = ax^2 \),将点\( M \)坐标代入求得\( a \),从而得到方程。然后通过描点法画出抛物线图形,进一步加深对...

    MATLAB作图教程全.ppt

    首先,MATLAB作图的基础是通过描点和连线的方式实现的。在画曲线图形时,我们需要先计算出一系列点的坐标,然后使用`plot`函数将这些点连接起来。例如,`plot(x,y,‘s’) `用于画出由坐标点`(x, y)`构成的实线图形,...

    Matlab在大学物理实验数据处理中的应用.pdf

    传统的手工计算法或描点作图法虽然可行,但效率低下且容易产生较大的误差。计算机技术的发展为实验数据处理提供了新的解决方案。 2. Matlab在实验数据处理中的优势 Matlab具有诸多优势,使其成为处理实验数据的理想...

    苏科版数学八年级上册 6.3一次函数的图像 (2)教案 .docx

    对于 y = kx + b,可以通过选择几个特定的 x 值计算对应的 y 值,并在直角坐标系中标出这些点,然后用光滑的曲线连接这些点。 4. **数形结合的意识**:通过观察函数图像和对应的数值表,学生可以理解函数值的变化...

    专题课件完美版第二章 第7节 函数的图象.pptx

    4. 列出关键点,如特殊点、零点、极值点、与坐标轴的交点,然后描点并连成曲线。 其次,函数图象的变换方法也是学习的重点: 1. 平移变换,如f(x) → f(x-k),将函数图象沿x轴平移k个单位。 2. 对称变换,关于x轴、...

    反比例函数的图像与性质.doc

    例如,通过描点法绘制反比例函数图象,学生可以发现,为了得到完整的图象,必须在每个象限选取不同的点,因为反比例函数在每个象限内都有定义。此外,连接这些点时,应该用平滑的曲线而不是直线,以准确地描绘函数的...

    高一数学集合与函数概念复习.doc

    12. **函数的图象**:通过描点法绘制函数图象,理解图象在研究函数性质中的重要性。 13. **历史与实践**:了解数学史上的重要事件和人物,以及生活中函数的实际应用。 **教学建议** 1. 强调集合语言的实用性,...

    2015春冀教版数学八下20.3《函数的表示》ppt课件1

    - **描点**:根据列表中的数据,在直角坐标系中描出对应的点。 - **连线**:用平滑的曲线连接这些点。 **示例**:题目中的例子给出了正方形面积\( S \)与边长\( x \)的关系式\( S = x^2 \),可以通过列表、描点、...

    三年级数学下册 周长教案7 沪教版 教案.doc

    教学重点是使学生理解周长的含义,而难点在于在实际操作中体验周长的概念,尤其是理解“化曲为直”的数学思想,即无论图形边缘是曲线还是直线,都可以通过测量转化为直线长度来计算周长。 教学过程中,教师首先通过...

    工程制图CAI:第四章 组合体.ppt

    形体分析法是处理组合体的关键技巧,它要求我们将组合体分解为若干个简单的几何体,分析它们之间的相对位置和组合形式。例如,可以将组合体划分为几个部分,如第一部分、第二部分和第三部分,然后逐一研究每个部分的...

Global site tag (gtag.js) - Google Analytics