0

リンクhttp://www.worldwidewhat.net/2011/06/draw-a-line-graph-using-html5-canvas/のように線グラフを作成しています

ここでは、異なる色で線を描きたいので、線の描画の間にbeignPath（）を使用してみました。これが私が使用したコードです

c.strokeStyle = '#f00';
c.beginPath();
c.moveTo(getXPixel(0), getYPixel(data.values[0].Y));

for(var i = 1; i < data.values.length; i ++) {
    if(i > 2){
        c.strokeStyle = 'green';
        c.beginPath();
    }
    c.lineTo(getXPixel(i), getYPixel(data.values[i].Y));
    c.stroke();
}

実際には、線の色が異なりますが、「緑」の色の開始線のストロークがありません。この問題を解決するのを手伝ってください

どんな助けでも大歓迎です。前もって感謝します...

4

2 に答える 2

2 
<?php
$r=100;

$a1=90;
$a1=180-$a1;

$ry=60;
$yb=60;

$a2=180-(90+$ry);
$a3=180-(90+$ry+$yb);

//subtract only x coordinate from x2;
$x=150;
$y=150;

$x1=150-cos(deg2rad($a1))*$r;
$y1=150-sin(deg2rad($a1))*$r;

$x2=150-cos(deg2rad($a2))*$r;
$y2=150-sin(deg2rad($a2))*$r;
$x2e=$x2-tan(deg2rad($a2));
$y2e=((($x2e-$x2)*($y2-$y))/($x2-$x))+$y2;


$x3=150-cos(deg2rad($a3))*$r;
$y3=150-sin(deg2rad($a3))*$r;

echo"
<!DOCTYPE html>
<html><head><style>
#i01{
    background color:red;
    width=350;
    height=350;

}

</style></head>
<body>


<canvas id='myCanvas' width='300' height='300' style='border:1px solid #d3d3d3;'  >
Your browser does not support the HTML5 canvas tag.</canvas>

<script>

var c = document.getElementById('myCanvas');
var ctx = c.getContext('2d');

ctx.beginPath();
ctx.arc(150, 150, $r, 0, 2 * Math.PI);
ctx.stroke();


//ctx.moveTo(150,150);
//ctx.lineTo(200,150);

ctx.beginPath();
ctx.moveTo($x,$y);
ctx.lineTo($x1,$y1);
ctx.font = '20px Arial';
ctx.fillText('R',$x1,$y1);
ctx.strokeStyle = 'red';
ctx.stroke();

ctx.beginPath();
ctx.moveTo($x,$y);
ctx.lineTo($x2,$y2);
ctx.strokeStyle = 'yellow';
ctx.font = '20px Arial';
ctx.fillText('Y',$x2,$y2);
ctx.stroke();

ctx.beginPath();
ctx.moveTo($x,$y);
ctx.lineTo($x3,$y3);
ctx.font = '20px Arial';
ctx.fillText('B',$x3,$y3);
ctx.strokeStyle = 'blue';
ctx.stroke();


</script>


</body>
</html>";
?>
于 2017-09-23T04:34:05.933 に答える
1

私は自分で問題を理解することができました..将来誰かがそれを必要とする場合は修正を投稿します..以前のX、Y値にc.moveToを作成しました..そしてpblmが修正されました..

于 2013-01-17T10:01:17.697 に答える