现在我有这样一个函数: y=a/(b+cx)
现在需要用js在坐标轴上画出这个图形,其中,y的取值要介于0到10之间请问,如何用js表现这样的图形?

解决方案 »

  1.   

    比如说:
    y=3/(4+2x)从数学角度来说,是个典型的反比例函数,随着x增大,y值趋向于0,当x=0的时候,y=3/4
    以坐标轴表现,就是一个反比例曲线。
    这个图形,只需要画在第一象限的图形,其他象限不管。现在想通过一个html页用js表现这样的坐标轴图形。
    请问如何来做。谢谢。
      

  2.   

    <html><head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <title>JS模拟曲线</title>
    </head><body>
    <style>
    #line{padding:0;margin:0;border:0;background:#efefef;width:10px;height:10px;overflow:visible;float:left}
    .linediv{border:1px #00f solid;border-top:0;border-right:0;height:300px;width:300px;}
    .sd{position:absolute;width:1px;height:1px;background:#000;font-size:1px;}
    </style><span id=x>Y</span>
    <div id=line></div><div id=y style="border:0px red solid;width:20px;height:300px;padding-top:280">X</div>
    <script language="javascript">
    <!--
    //曲线:y=3/(4+2x) 
    function getposition(obj) {//获取对象位置(top/left坐标)
    var r = new Array();
    r['x'] = obj.offsetLeft;
    r['y'] = obj.offsetTop;
    while(obj = obj.offsetParent) {
    r['x'] += obj.offsetLeft;
    r['y'] += obj.offsetTop;
    }
    return r;
    }
    //坐标线
    var obj=document.getElementById("line")
    var lineObj=document.createElement("div");
    lineObj.id="linediv"
    lineObj.className="linediv"
    obj.appendChild(lineObj)//获取坐标线原点坐标
    var p = getposition(lineObj);
    px=p['x']
    py=p['y']+lineObj.offsetHeight//划点
    var HeightBig=500;//高度放大倍数
    var WidthBig=lineObj.offsetWidth;//水平取值范围
    for (var i=1;i<=WidthBig;i++){
    var x=i*1,y=3/(4+2*i)*HeightBig; 
    var sd=document.createElement("span")
    sd.className="sd"
    sd.style.top=py-y+"px"
    sd.style.left=px+x+"px"
    lineObj.appendChild(sd)
    }
    //连线
    var PObj=lineObj.getElementsByTagName("span")
    for (var i=0;i<WidthBig/4;i++){
    var addT=PObj[i+1].offsetTop-PObj[i].offsetTop
    if (addT &&addT>0)PObj[i].style.height=addT
    else i=WidthBig
    }
    //-->
    </script>
    </body></html>
      

  3.   

    太牛了,太喜欢了,原来javascript还有作图功能,我一定要把它学会了