Canvas 画布中坐标系的位置问题(原点确定)

Canvas在后台数据可视化中十分重要，很多时候数据都会有Canvas化成一系列类似于折线图和饼状图的形式呈现。最近在学习Canvas过程中，学到建立坐标系过程中。在确定了步骤之后，发现原点确立有个小问题。
刚开始确定了6个步骤：

但是在原点确立过程中，发现在我设置了space和arrowSizede的值时(旁边是我自己的理解)，发现y轴原点确立只能这么计算：

最终所呈现的效果是这样的(即大部分折线图、饼状图固定的坐标样子)：
当我修改y轴的计算式子时：

呈现的效果却成了这样：

原来Canvas中它不仅仅有默认好的宽高，还有一个默认的坐标轴，以左上角为原点，方向如下图中的红色坐标系，而我们自己创建的坐标系(下图中蓝色坐标系)是基于Canvas本身的坐标来建立的。
这也就说明了为什么在设置y轴原点的时候，不能直接用space，而只能用canvasHeight - space。我们自己创建的坐标系中y轴的原点，其实是在Canvas坐标系中的y轴方向上获取到的canvasHeight来减去space。