HTML5 Canvas曲线图的Y轴坐标最小值如何设置为0 5

如果Y轴最大刻度是30的话,最小刻度就是-5,如果最大刻度设置成300,最小刻度就变成-50我想将最小刻度设置成0,去哪里设置呢?这里有代码和效果图:http://dow... 如果Y轴最大刻度是30的话, 最小刻度就是-5, 如果最大刻度设置成300, 最小刻度就变成-50
我想将最小刻度设置成0, 去哪里设置呢?

这里有代码和效果图:http://down.admin5.com/texiao/116795.html
是通过jqplot插件实现的. 展开

 我来答

1个回答

#热议# 上班途中天气原因受伤算工伤吗？

菜鸟Taurus
2016-02-10 · 超过34用户采纳过TA的回答

知道答主

回答量：104

采纳率：100%

帮助的人：49.6万

我也去答题访问个人页

关注

展开全部

<!DOCTYPE html>
<html>
<head>
<title>Cos演示</title>
<meta charset='utf-8'>
</head>
<body style='<a href="https://www.baidu.com/s?wd=text-align&tn=44039180_cpr&fenlei=mv6quAkxTZn0IZRqIHckPjm4nH00T1dhmynLuj0vuH01rj9-rjI90ZwV5Hcvrjm3rH6sPfKWUMw85HfYnjn4nH6sgvPsT6KdThsqpZwYTjCEQLGCpyw9Uz4Bmy-bIi4WUvYETgN-TLwGUv3EnHT4PH6kPjcsrHf3Pj0LPHcvPs" target="_blank" class="baidu-highlight">text-align</a>:center'>
<canvas width='800' height='600' id='canvas' style='border:1px solid'>

</canvas>
<script>
var canvas=document.getElementById('canvas');
var ctx=canvas.getContext('2d');
function drawAxis(){
ctx.translate(400,300);
//x 轴
ctx.beginPath();
ctx.moveTo(-380,0);
ctx.lineTo(380,0);
ctx.lineTo(372,3);
ctx.lineTo(372,-3);
ctx.lineTo(380,0);
ctx.stroke(); //描边
//y 轴
ctx.moveTo(0,200);
ctx.lineTo(0,-200);
ctx.lineTo(3,-192);
ctx.lineTo(-3,-192);
ctx.lineTo(0,-200);
ctx.stroke(); //描边
//画坐标
ctx.save();
ctx.strokeStyle='rgba(100,100,255,0.5)';
ctx.moveTo(-Math.PI*100,100);
ctx.lineTo(-Math.PI*100,-100);
ctx.lineTo(Math.PI*100,-100);
ctx.lineTo(Math.PI*100,100);
ctx.lineTo(-Math.PI*100,100);
ctx.stroke(); //描边
ctx.fillStyle='rgba(0,0,0,1)';
ctx.fillText("-π",-Math.PI*100,10);
ctx.fillText("π",Math.PI*100,10);
ctx.fillText("-1",5,100);
ctx.fillText("1",5,-100);
ctx.restore();

}
function drawCos(){
var x = -Math.PI*100;
ctx.beginPath();
ctx.moveTo(x,100);
for(x = -Math.PI*100;x<Math.PI*100;x++){
var cx = x/100;
var cy = Math.cos(cx);
var y = -cy*100;
ctx.lineTo(x,y);
}
ctx.stroke(); //描边
}
function draw(){
ctx.clearRect(0,0,canvas.width,canvas.height);
ctx.save();
ctx.shadowColor='rgba(0,0,0,0.8)';
ctx.shadowOffsetX=12;
ctx.shadowOffsetY=12;
ctx.shadowBlur=15;
drawAxis();
drawCos();
ctx.restore();
}
ctx.fillStyle='rgba(100,140,230,0.5)';
ctx.strokeStyle='rgba(33,33,33,1)';
draw();
</script>
</body>
</html>

已赞过 已踩过<

评论收起

推荐律师服务：若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询

HTML5 Canvas曲线图的Y轴坐标最小值如何设置为0 5

其他类似问题

为你推荐：