计算机辅助数据绘图（matlab\python\js）

1. matlab绘图

官方说明：https://ww2.mathworks.cn/help/matlab/creating_plots/types-of-matlab-plots.html

基本图形绘制

hold on

x=linspace(0, 2*pi, 100);

y=sin(x); z=cos(x);  %基本函数

plot(x,y,'-',x,z);  %基本绘图

legend('sin(x)','cos(x)');  %注解

title('test');  %标题

xlabel('x'); ylabel('y or z');  %坐标标注

str='$$ \sin x $$';

text(1.19,0.42,str,'Interpreter','latex','FontSize',18);  %图表中加入latex公式

annotation('arrow','x',[0.35 0.4],'y',[0.71 0.78]);  %创建注释

    %annotation(lineType,x,y) 创建一个在当前图窗中的两个点之间延伸的线条或箭头注释。

    %将 lineType 指定为 'line'、'arrow'、'doublearrow' 或 'textarrow'。

    %将 x 和 y 分别指定为 [x_begin x_end] 和 [y_begin y_end] 形式的二元素向量。

hold off

输出结果为：

图1. 基本图形绘制

可以看到上面的图形包含了最基本的绘图，坐标轴以及相应注解。注意，由于x为向量，所有在进行某些运算时需要在相应运算符前加上"."号，以进行数值计算。

基本命令：

plot:我们主要使用plot(X,Y,LineSpec)的形式来设置线型、标记符号和颜色。有关LineSpec的详细参数如下图：

图2. plot函数中LineSpec参数的说明

legend:主要用于绘制图例说明，及图1右上角的方框。
title、xlabel、ylabel:分别用于绘制标题、X坐标标注、Y坐标标准。
text:插入LaTex公式，并固定位置。

多图绘制和图像设置

多图在同一个figure上输出：

x=linspace(0, 2*pi, 100);

y=sin(x);

z=cos(x);

s=x+2;

t=x.^2;

subplot(2,2,1),plot(x,y);

subplot(2,2,2),plot(x,z);

subplot(2,2,3),plot(x,s);

subplot(2,2,4),plot(x,t);

输出结果如下：

图3. 多图绘制样例1

subplot的前两个参数表示2x2的分布，最后一个参数表示序号。然后再用逗号分隔，再加上plot命令即可完成相应序号的图形绘制。

多图在不同figure上输出及图形的设置：

x=linspace(0, 2*pi, 100);

y=sin(x); z=cos(x);

figure('Position',[311 211 360 220]),plot(x,z);

figure, h=plot(x,y);

get(h);  %line property

get(gca);  %axes property

set(gca, 'XLim', [0 2*pi]);

set(gca, 'FontSize', 25);

set(gca,'XTick', 0:pi/2:2*pi);

set(gca,'XTickLabel', {'0','\pi/2','\pi','3\pi/2','2\pi'});

set(h, 'LineStyle', '-.', 'LineWidth', 7.0, 'color', 'g');

输出结果为：

图4. 多图绘制样例2

figure :使用默认属性值创建一个新的图窗窗口。生成的图窗为当前图窗。其中'Position'参数可以指定绘制图形绘制区域的位置与大小。
v = get(h) :返回 h 标识的图形对象的所有属性和属性值。v 是一个结构体，其字段名称为属性名称，其值为对应的属性值。h 可以是单个对象或 m×n 对象数组。如果 h 是单个对象且您不指定输出参数，则 MATLAB 会在屏幕上显示该信息。(可使用help命令查看更多说明)。
set(H,Name,Value):为 H 标识的对象指定其 Name 属性的值。使用时须用单引号将属性名引起来，例如，set(H,'Color','red')。如果 H 是对象的向量，则 set 会为所有对象设置属性。如果 H 为空（即 []），set 不执行任何操作，但不返回错误或警告。

图像设置:

首先通过get函数获取相关属性，再使用set函数设置相关命令。（get并非编程必须的操作，即知道相关属性可直接使用set设置）
gca:表示数轴的属性，可用来设置x,y坐标轴的长度与宽带及坐标标注。

三维图形绘制

基本三维绘图

%% 三维

[X,Y] = meshgrid(1:0.1:10,1:0.1:20);

Z = sin(X) + cos(Y);

s=surf(X,Y,Z)

colorbar

输出图像为：

图5. 三维绘图样例1

也可以加上s.EdgeColor = 'none';

图6. 三维绘图样例2

2.python绘图

官方文档：https://matplotlib.org/stable/gallery/index.html

菜鸟教程：https://www.runoob.com/w3cnote/matplotlib-tutorial.html

图7. 计算机绘图的组成

使用python绘图时，通常会使用到numpy库与matplotlib库。关于matplotlib的详细介绍在mtaplotlib的官网都有详细介绍。

基本绘图

import matplotlib.pyplot as plt

import numpy as np

x=np.linspace(1.0,4.0,20)

print(x)

y=x*x*x+x*x+1

plt.plot(x,y,color="blue", linewidth=2.5, linestyle="-")

plt.ylabel('some numbers')

plt.show()

输出图像如下：

图8. matplotlib基本绘图

python中numpy中的linspace用法与matlab中的用法有所区别，x=np.linspace(1.0,4.0,20)表示在[1.0,4.0]区间均等分生成20个数值。
plot:是用来绘图的主要命令，可以通过color等参数设置相关属性。
show:用于展示最终生成的图形。

多图绘制与标注

import matplotlib.pyplot as plt

import numpy as np

import matplotlib.gridspec as gridspec

fig = plt.figure(tight_layout=True)

gs = gridspec.GridSpec(2, 2)

ax = fig.add_subplot(gs[0, :])

ax.plot(np.arange(0, 1e6, 1000))

ax.set_ylabel('YLabel0')

ax.set_xlabel('XLabel0')

for i in range(2):

    ax = fig.add_subplot(gs[1, i])

    ax.plot(np.arange(1., 0., -0.1) * 2000., np.arange(1., 0., -0.1))

    ax.set_ylabel('YLabel1 %d' % i)

    ax.set_xlabel('XLabel1 %d' % i)

    if i == 0:

        for tick in ax.get_xticklabels():

            tick.set_rotation(55)

fig.align_labels()  # same as fig.align_xlabels(); fig.align_ylabels()

plt.show()

图像输出为：

图9. matplotlib多图绘制

tight_layout=True:代码中的第五行参数表示——作图自动tight（紧凑）布局。（参考）
GridSpec：指定要放置子批次的网格的几何图形。需要设置网格的行数和列数。或者，可以调整子批次布局参数（例如，左、右等）。gs = gridspec.GridSpec(2, 2):表明生成2x2的子图。可以参考这篇文章。
add_subplot(self, *args, **kwargs):向figure添加一个Axes作为一subplot布局的一部分。可以参考这篇文章。

3.echarts绘图

官方网址：https://echarts.apache.org/examples/zh/index.html

echarts为JavaScript的一个绘图工具。是一个功能齐全的数据可视化工具。

基本介绍

我们这里使用一个较为简单的示例：

官网为我们提供了在线编辑功能，所以对于基本的绘图我们可以直接在官网编辑后输出。

编辑后输出的图片：

图10. echarts基本绘图

当然对于使用json格式存储引用的数据无法直接在线编辑，需要下载相应的库。（博主对echarts使用较少，有相关建议或想法欢迎评论区指出）。

LiTecdows