[发明专利]一种坐标轴的绘制方法及装置

说明书

本申请提供一种坐标轴的绘制方法及装置，所述方法包括：接收待绘制坐标轴的起点、终点坐标以及刻度线间距；绘制从所述起点坐标指向所述终点坐标的向量；根据所述刻度线间距，计算所述待绘制坐标轴中每一条刻度线在所述向量上的刻度点坐标；根据所述刻度点坐标，绘制出垂直于所述向量的刻度线，从而完成坐标轴的绘制。应用本申请实施例，基于向量的坐标轴的绘制，使得绘制的坐标轴与坐标系解绑，所以无需考虑坐标系的任何变化，也就无需配置相应代码，如此减少了绘制坐标轴的代码量。

技术领域

本申请涉及互联网技术领域，尤其涉及一种坐标轴的绘制方法及装置。

背景技术

网站编程人员在网页设计的中，经常需要绘制一些图像、表格等。网页图表绘制引擎(以下简称为引擎)就提供了这种功能。

接下来以HTML 5 Canvas，即画布为例。这里的画布是指一个矩形区域，用户可以控制该画布上的每一个像素。通常，画布可以拥有多种绘制路径、矩形、圆形、字符以及添加图像等方法。为了实现上述绘制方法，首先必须要在画布中绘制坐标轴，然后才可以绘制其它的东西。

现有技术中，坐标轴的绘制一般是基于坐标系的。由于坐标系可以进行各种各样地变化，例如转置transpose、反射reflect、旋转、平移、缩放等；所以每当坐标系变化后，对应的坐标轴也需要进行变化，这样就要求在绘制坐标轴的时候针对每一种变化配置对应的重新计算坐标轴线、刻度线位置的代码。

然而，坐标系的变化是多样的，代码不可能覆盖到所有的情况，即使覆盖到了也会导致绘制坐标轴的代码太过庞大冗余，难以维护。

发明内容

本申请提供的一种坐标轴的绘制方法及装置，以解决现有技术中为了应对坐标系变化所导致绘制坐标轴的代码过于庞大冗余的问题。

根据本申请实施例提供的一种坐标轴的绘制方法，所述方法包括：

接收待绘制坐标轴的起点、终点坐标以及刻度线间距；

绘制从所述起点坐标指向所述终点坐标的向量；

根据所述刻度线间距，计算所述待绘制坐标轴中每一条刻度线在所述向量上的刻度点坐标；

根据所述刻度点坐标，绘制出垂直于所述向量的刻度线，从而完成坐标轴的绘制。

可选的，根据所述刻度线间距，计算所述待绘制坐标轴中每一条刻度线在所述向量上的刻度点坐标，具体包括：

根据所述刻度线间距，均分所述向量；

计算所述均分后向量上的每一个刻度点的坐标。

可选的，根据所述刻度点坐标，绘制出垂直于所述向量的刻度线，具体包括：

获取预设的刻度线长度；

以所述刻度线坐标为起点坐标，绘制出垂直于所述向量并且长度为所述刻度线长度的刻度线。

可选的，根据所述刻度点坐标，绘制出垂直于所述向量的刻度线，具体包括：

根据所述向量，计算出单位垂直向量；

根据所述单位垂直向量以及预设的刻度线长度，计算待绘制刻度线中所述刻度点坐标对应的另一端的端点坐标；

绘制所述刻度点坐标连接对应的端点坐标的线段，得到待绘制的垂直于所述向量的刻度线。

可选的，绘制的刻度线垂直于所述向量的方向，由如下方式确定：

获取预设的标记值；所述标记值用于指示绘制的刻度线垂直于向量的方向；

根据所述标记值，确定所述刻度线垂直于向量的方向。

根据本申请实施例提供的一种坐标轴的绘制装置，所述装置包括：