Php 使用画布旋转radarplot中的箭头

我正在尝试将箭头添加到画布中编码的雷达/蜘蛛图中。因为我使用PHP/SQL来检索一些数据库值，所以我会回显大部分需要的JS以在画布上绘制它。到目前为止，我已经绘制了轴（7）和准则（5个值）

如何旋转箭头使其正确显示；在7轴的末端有一个角度

function drawArrows(context){
    context.beginPath();
    context.strokeStyle = "#ccc";
    context.lineWidth = 2;
    context.save();
<?php
$arrowHoek = 35;
$cHoek = (360/7);
$arrowLength = 10;

for ($i = 1 ; $i < 8 ; $i++) {
    $arrow_xleft = round((getCoordinates($i,6,x))-(sin(deg2rad($arrowHoek))*$arrowLength),2);
    $arrow_yleft = round((getCoordinates($i,6,y))+(cos(deg2rad($arrowHoek))*$arrowLength),2);
    $arrow_xright = round((getCoordinates($i,6,x))+(sin(deg2rad($arrowHoek))*$arrowLength),2);
    $arrow_yright = $arrow_yleft;
    $arrow_rotation = deg2rad(($cHoek*$i)-$cHoek);      

    echo "\tcontext.moveTo(";   
    getCoordinates($i,6,null);
    echo ");\n";
    echo "\tcontext.lineTo($arrow_xleft, $arrow_yleft);";
    echo "\n\tcontext.moveTo(";
    getCoordinates($i,6,null);
    echo ");\n";
    echo "\tcontext.lineTo($arrow_xright, $arrow_yright);\n";
    echo "\tcontext.rotate($arrow_rotation);\n";
    echo "\tcontext.restore();\n";
    echo "\tcontext.save();\n"; 

} 
?>
context.stroke();
}

函数绘图箭头（上下文）{
context.beginPath（）；
context.strokeStyle=“#ccc”；
context.lineWidth=2；
context.save（）；
stroke（）；
}

看来我已经解决了！如其他主题中所示，这将使用save（）、translate（）、rotate（）和restore（）函数。如果将其放在单独的Javascript函数中，则可以对各个画布部分进行转换，而不会弄乱任何其他图形

下面是解决方案（注意，它使用PHP来响应Javascript函数）

函数绘图箭头（上下文）{
context.beginPath（）；
context.strokeStyle=“#ccc”；
context.lineWidth=2；
stroke（）；
}

• 注意：上下文和画布元素的声明在容器函数中

function drawArrows(context){
context.beginPath();
context.strokeStyle = "#ccc";
context.lineWidth = 2;
<?php
$arrowHoek = 35;
$cHoek = (360/7);
$arrowLength = 10;

for ($i = 1 ; $i < 8 ; $i++) {
    $arrow_xleft = -(sin(deg2rad($arrowHoek))*$arrowLength);
    $arrow_yleft = (cos(deg2rad($arrowHoek))*$arrowLength);
    $arrow_xright = (sin(deg2rad($arrowHoek))*$arrowLength);
    $arrow_yright = $arrow_yleft;
    $arrow_rotation = deg2rad(($cHoek*$i)-$cHoek);  

    echo "\tcontext.save();\n";
    echo "\tcontext.translate(";    
    getCoordinates($i,6,null);
    echo ");\n";
    echo "\tcontext.rotate($arrow_rotation);\n";
    echo "\tcontext.moveTo($arrow_xleft, $arrow_yleft);";
    echo "\n\tcontext.lineTo(0,0);\n";
    echo "\tcontext.lineTo($arrow_xright, $arrow_yright);\n";
    echo "\tcontext.restore();\n";
} 
?>
context.stroke();
}