CN111666527A - 一种基于web页面的多媒体编辑方法及装置 - Google Patents

Abstract

本发明提供了一种基于web页面的多媒体编辑方法及装置，涉及图像处理领域。所述方法包括：在web页面的视频片段编辑区域中，接收对目标片段的拖拽操作；在拖拽操作结束时，若目标片段位于第一时间线轨道中，则确定当前接收到的处理指令的类型；其中，第一时间线轨道中显示有待编辑视频；若处理指令的类型为插入指令，则根据目标片段在第一时间线轨道中的位置，将目标片段插入待编辑视频；若处理指令的类型为覆盖指令，则根据目标片段在第一时间线轨道中的位置，将目标片段覆盖在待编辑视频上。在本发明实施例，可将目标片段自动插入待编辑视频或覆盖在待编辑视频上，且web页面的视频片段编辑区可自由实现插入功能或覆盖功能，提高用户的体验度。

Description

一种基于web页面的多媒体编辑方法及装置

技术领域

本发明涉及图像处理领域，特别是涉及一种基于web页面的多媒体编辑方法及装置。

背景技术

在图像/视频的后期处理软件中，通常利用web端后期处理软件来实现对视频/音频片段的位置调整，或新增、删除视频/音频片段。而在目前web端后期处理软件中，其通常只能兼容覆盖功能，以同时达到新增和删除的目的。

然而，若用户想要在不破坏已编辑的原始已有视频的顺序和效果的基础上，来插入新的视频片段时，采用覆盖的方式会破坏原始已有视频片段的顺序和效果，导致原始已有片段内容的错乱。而若要保证原始已有片段的顺序和效果的不变，在单一的覆盖功能中，就需要用户手动拖动新的片段所要插入点位置之后的所有原始已有片段，使得插入方式繁琐，用户体验度不高。

发明内容

本发明实施例提供一种基于web页面的多媒体编辑方法及装置，以至少解决现有技术中web页面兼容的功能单一，且在插入新片段时，手动插入新片段的方式导致插入方式繁琐、用户体验度不高的问题。

为了解决上述技术问题，本发明是这样实现的：

第一方面，本申请提供了一种基于web页面的多媒体编辑方法，包括：

在web页面的视频片段编辑区域中，接收对目标片段的拖拽操作；

在所述拖拽操作结束时，若所述目标片段位于第一时间线轨道中，则确定当前接收到的处理指令的类型；其中，所述第一时间线轨道中显示有待编辑视频；

若所述处理指令的类型为插入指令，则根据所述目标片段在所述第一时间线轨道中的位置，将所述目标片段插入所述待编辑视频；

若所述处理指令的类型为覆盖指令，则根据所述目标片段在所述第一时间线轨道中的位置，将所述目标片段覆盖在所述待编辑视频上。

可选地，所述接收对目标片段的拖拽操作，包括：

接收对目标片段所对应的第一图像元素的拖拽操作；

所述根据所述目标片段在所述第一时间线轨道中的位置，将所述目标片段插入所述待编辑视频，包括：

根据所述第一图像元素在所述第一时间线轨道中的位置，将所述第一图像元素插入所述待编辑视频对应的待编辑图像元素中；

根据所述第一时间线轨道中插入后的待编辑图像元素，将所述目标片段插入所述待编辑视频；

所述根据所述目标片段在所述第一时间线轨道中的位置，将所述目标片段覆盖在所述待编辑视频上，包括：

根据所述第一图像元素在所述第一时间线轨道中的位置，将所述第一图像元素覆盖在所述待编辑视频对应的待编辑图像元素上；

根据所述第一时间线轨道中覆盖后的待编辑图像元素，将所述目标片段覆盖在所述待编辑视频上。

可选地，所述根据所述第一图像元素在所述第一时间线轨道中的位置，将所述第一图像元素插入所述待编辑视频对应的待编辑图像元素中的步骤，包括：

根据所述第一图像元素在所述第一时间线轨道中的位置，确定所述第一图像元素的插入起始点位置和插入结束点位置；

根据所述插入起始点位置，在所述待编辑图像元素中，确定出所述插入起始点位置之后的待编辑图像元素片段；

将确定出的所述插入起始点位置之后的待编辑图像元素片段向后移动，直至移动到所述插入结束点位置之后；

根据所述插入起始点位置和所述插入结束点位置，将所述第一图像元素显示在所述第一时间线轨道中。

可选地，所述在所述拖拽操作结束时，若所述目标片段位于第一时间线轨道中，则确定当前接收到的处理指令的类型的步骤，包括：

在所述拖拽操作结束时，若所述目标片段位于第一时间线轨道中，且接收到预设按键的指令，则确定当前接收到的处理指令为插入指令；

在所述拖拽操作结束时，若所述目标片段位于第一时间线轨道中，且未接收到预设按键的指令，则确定当前接收到的处理指令为覆盖指令。

可选地，在所述web页面中提供比例尺调整控件；

在接收到对所述比例尺调整控件的调整操作后，调整所述视频片段编辑区域的显示精度。

第二方面，本申请实施例还提供了一种基于web页面的多媒体编辑装置，包括：

接收模块，用于在web页面的视频片段编辑区域中，接收对目标片段的拖拽操作；

判断模块，用于在所述拖拽操作结束时，若所述目标片段位于第一时间线轨道中，则确定当前接收到的处理指令的类型；其中，所述第一时间线轨道中显示有待编辑视频；

插入模块，用于若所述处理指令的类型为插入指令，则根据所述目标片段在所述第一时间线轨道中的位置，将所述目标片段插入所述待编辑视频；

覆盖模块，用于若所述处理指令的类型为覆盖指令，则根据所述目标片段在所述第一时间线轨道中的位置，将所述目标片段覆盖在所述待编辑视频上。

可选地，所述接收模块，具体用于在web页面的视频片段编辑区域中，接收对目标片段所对应的第一图像元素的拖拽操作；

所述插入模块，包括：

第一插入模块，用于若所述处理指令的类型为插入指令，则根据所述第一图像元素在所述第一时间线轨道中的位置，将所述第一图像元素插入所述待编辑视频对应的待编辑图像元素中；

第二插入模块，用于根据所述第一时间线轨道中插入后的待编辑图像元素，将所述目标片段插入所述待编辑视频；

所述覆盖模块，包括：

第一覆盖模块，用于若所述处理指令的类型为覆盖指令，则根据所述第一图像元素在所述第一时间线轨道中的位置，将所述第一图像元素覆盖在所述待编辑视频对应的待编辑图像元素上；

第二覆盖模块，用于根据所述第一时间线轨道中覆盖后的待编辑图像元素，将所述目标片段覆盖在所述待编辑视频上。

可选地，所述第一插入模块，包括：

第一确定模块，用于根据所述第一图像元素在所述第一时间线轨道中的位置，确定所述第一图像元素的插入起始点位置和插入结束点位置；

第二确定模块，用于根据所述插入起始点位置，在所述待编辑图像元素中，确定出所述插入起始点位置之后的待编辑图像元素片段；

移动模块，用于将确定出的所述插入起始点位置之后的待编辑图像元素片段向后移动，直至移动到所述插入结束点位置之后；

第一显示模块，用于根据所述插入起始点位置和所述插入结束点位置，将所述第一图像元素显示在所述第一时间线轨道中。

第三方面，本申请实施例还提供了一种电子设备，包括处理器、存储器及存储在所述存储器上并可在所述处理器上运行的计算机程序，所述计算机程序被处理器执行时实现所述的基于web页面的多媒体编辑方法的步骤。

第四方面，本申请实施例还提供了一种计算机可读存储介质，所述计算机可读存储介质上存储计算机程序，所述计算机程序被处理器执行时实现所述的基于web页面的多媒体编辑方法的步骤。

在本发明实施例中，在web页面的视频片段编辑区域中，接收对目标片段的拖拽操作；在拖拽操作结束时，若目标片段位于第一时间线轨道中，则确定当前接收到的处理指令的类型；其中，第一时间线轨道中显示有待编辑视频；若处理指令的类型为插入指令，则根据目标片段在第一时间线轨道中的位置，将目标片段插入待编辑视频；若处理指令的类型为覆盖指令，则根据目标片段在第一时间线轨道中的位置，将目标片段覆盖在待编辑视频上。即，可根据相应的处理指令就可自动将目标片段插入待编辑视频或覆盖在待编辑视频上，并且，web页面的视频片段编辑区可自由实现插入功能或覆盖功能，用户体验度较高。

附图说明

图1示出了本发明的一种基于web页面的多媒体编辑方法的流程图；

图2示出了本发明的用于多媒体编辑的web页面布局示意图；

图3示出了本发明的用于多媒体视频合成的web页面布局示意图；

图4示出了本发明的另一种基于web页面的多媒体编辑方法的流程图。

图5示出了本发明中将目标片段对应的第一图像元素插入待编辑视频对应的待编辑图像元素的流程图。

图6示出了编辑区内，未接受拖曳操作的目标片段对应的第一图像元素和待编辑视频对应的待编辑图像元素的示意图。

图7a、图8a、图9a、图10a示出了在编辑区内的拖曳操作结束时，目标视频帧图像片段在完成插入操作之前与待编辑视频帧图像片段的不同位置关系示意图。

图7b、图8b、图9b、图10b示出了目标视频帧图像片段在完成插入操作之后与待编辑视频帧图像片段的不同位置关系示意图。

图11示出了本发明中将确定出的插入起始点位置之后的待编辑图像元素片段向后移动，直至到插入结束点位置之后的流程图。

图12示出了本发明中将目标片段对应的第一图像元素覆盖在待编辑视频对应的待编辑图像元素上的流程图。

图13示出了本发明的一种基于web页面的多媒体编辑装置的流程图。

图14为本发明的一种电子设备的结构框图。

图15为实现本发明各个实施例的一种电子设备的硬件结构示意图。

具体实施方式

下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。

参照图1，示出了本发明的一种基于web页面的多媒体编辑方法的步骤流程图，该方法包括：

在介绍本发明实施例前，先对多媒体编辑的web页面布局示意图进行介绍。参考图2，用户在网址链接栏输入网址链接以发送界面显示请求至服务器，服务器根据界面显示请求中所包含的链接查找对应的网页数据，并将网页数据返回给web页面，web页面根据接收到的网页数据进行渲染以进行展示。

本发明实施例中，在网址链接对应的web页面中提供了资源库、视频预览区、编辑区。

资源库中保存了大量的项目资源、用户自己的资源和公共所能共享的资源，并且在资源库中设置了多个资源库控件，用户通过资源库控件从服务器的资源库中选择多媒体资源。参考图2中，资源库控件包括：项目资源按钮a、我的资源按钮b和公共资源按钮c，用户触发其中一个资源库控件，就可从服务器中获取到对应的多媒体资源，并将各个多媒体资源资源进行显示在页面以供用户选择。

多媒体资源是多种媒体的综合性资源，一般包括文本资源，声音资源和图像资源等多种媒体形式。

视频预览区用以展示用户所选择的资源，以供用户对资源的内容进行初步预览。

编辑区也就是视频片段编辑区域。在编辑区中具有：目标片段轨道2，用于显示未接受拖曳操作的目标片段的图像；视频帧轨道3，用于显示待编辑的视频帧图像；音频轨道4，用于显示待编辑的音频图像；字幕轨道5，用于显示待编辑的字幕图像；时间轴轨道1，用以显示时间轴。此外，编辑区中还设置有拖动轴6，用于与时间轴轨道1配合，以实现对视频的音频图像、字幕图像、视频帧图像中的至少一种图像的精确切割操作，可将图像切割为多个片段。还设置有比例尺调整控件7，用以实现对编辑区域中各轨道上图像的显示精度的调整。

步骤101：在web页面的视频片段编辑区域中，接收对目标片段的拖拽操作；

结合图2举例说明，用户在资源库中对项目资源按钮a、我的资源按钮b和公共资源按钮c中的任一按钮进行触发操作。例如，触发了公共资源按钮c，就会将资源A-F进行显示以供用户选择。假设用户想选择资源A进行编辑，此时，用户点击资源A，资源A就会在视频预览区显示，以供用户查看资源A的具体内容。用户对资源A进行拖曳操作，将资源A拖曳至编辑区中，就会将资源A的元素所对应的图像显示在轨道中，作为待编辑视频以供用户进行后续编辑操作。其中，视频帧、音频、字幕均属于元素。本发明实施例中，示例性地，默认资源A为视频帧，将资源A拖曳至编辑区时，将资源A的视频帧图像显示在视频帧轨道3中。

本发明实施例中，在编辑区已经显示有待编辑视频时，目标片段可以为用户从资源库中重新选择的资源所对应的图像片段。例如，在视频帧轨道3中已经显示有作为待编辑视频的资源A的视频帧图像时，用户从资源库中再次选择了元素同样为视频帧的资源B，并将资源B拖动到目标片段轨道2中，在目标片段轨道2中显示资源B所对应的视频帧图像，此时，所显示的资源B对应的视频帧图像就为目标片段。目标片段也可以为从待编辑视频所对应的图像中切割所选取的图像片段。例如，在视频帧轨道3中已经显示有作为待编辑视频的资源A的视频帧图像时，用户利用拖动轴6来对资源A的视频帧图像进行切割划分，并选取其中一个切割片段作为目标片段，以将目标片段插入/覆盖至资源A在视频帧轨道3中其它位置的视频帧图像中。

在目标片段为从资源库中重新选择的资源时，本步骤中，接收对目标片段的拖曳操作可以为：将目标片段轨道2中所显示的目标片段拖曳至第一时间线轨道中的拖曳操作。其中，第一时间线轨道为视频帧轨道、音频轨道、字幕轨道中的任一一个轨道，且第一时间线轨道中所显示的待编辑视频的元素与目标片段的元素相同。在目标片段为从待编辑视频所对应的图像中切割选取的图像片段时，本步骤中，接收对目标片段的拖曳操作还可以为：将已经处于第一时间线轨道中的目标片段从现有位置拖曳至第一时间线轨道中的其它位置。本步骤中的拖曳操作是指仅在编辑区内的拖曳操作，而并不是指从资源库到编辑区的拖曳操作。

步骤102：在所述拖拽操作结束时，若所述目标片段位于第一时间线轨道中，则确定当前接收到的处理指令的类型；其中，所述第一时间线轨道中显示有待编辑视频；

本步骤中，第一时间线轨道如何确定，取决于目标片段的元素类型。本发明实施例中，视频帧、音频、字幕均属于元素。若目标片段为目标视频帧图像，则第一时间线轨道为视频帧轨道；若目标片段为目标音频图像，则第一时间线轨道为音频轨道；若目标片段为目标字幕图像，则第一时间线轨道为字幕轨道。并且，目标片段的元素与第一时间线轨道中所显示的待编辑视频的元素一致。

在编辑区内，对目标片段的拖曳操作结束时，若目标片段位于第一时间线轨道中，就说明用户可能有对待编辑视频进行编辑的需求，此时确定当前接收到的处理指令的类型。

可选地，步骤102包括以下子步骤1021-1022：

子步骤1021：在所述拖拽操作结束时，若所述目标片段位于第一时间线轨道中，且接收到预设按键的指令，则确定当前接收到的处理指令为插入指令；

子步骤1022：在所述拖拽操作结束时，若所述目标片段位于第一时间线轨道中，且未接收到预设按键的指令，则确定当前接收到的处理指令为覆盖指令。

在判断处理指令类型时，在目标片段处于第一时间线轨道中的前提下，可以根据有没有接收到预设按键的指令来确定是插入指令还是覆盖指令。预设按键可以为键盘上的Ctrl键，预设按键指令可为一次按压操作。用户只需要按压一下Ctrl键，就可自动执行插入操作，若没有按压Ctrl键，就自动执行覆盖操作，本领域技术人员也可根据实际需求设置预设按键和触发预设按键的指令，对此不作具体限制。

可选地，本发明实施例还提供了另一种情况，具体为：

在执行步骤101前，还包括：

判断接收到的模式切换指令的类型；

若所述模式切换指令的类型为插入模式指令，则web页面的视频片段编辑区域的编辑模式切换为插入模式；

若所述模式切换指令的类型为覆盖模式指令，则web页面的视频片段编辑区域的编辑模式切换为覆盖模式。

则，步骤102可以为：在所述拖曳操作结束时，若所述目标片段位于第一时间线轨道，则根据编辑模式执行编辑操作。

在本发明实施例提供的另一种情况中，用户预先切换视频片段编辑区域的编辑模式，使得在对编辑区内的目标片段一旦停止拖曳操作，就可自助执行插入操作或覆盖操作。

需要说明的是，上述子步骤1021-1022与所提供的另一种情况选其中一个实现即可，本领域技术人员也可根据实际需要设置执行覆盖操作或插入操作的具体实现方式，对此不作限制，均在本发明保护范围内。

步骤103：若所述处理指令的类型为插入指令，则根据所述目标片段在所述第一时间线轨道中的位置，将所述目标片段插入所述待编辑视频；

步骤104：若所述处理指令的类型为覆盖指令，则根据所述目标片段在所述第一时间线轨道中的位置，将所述目标片段覆盖在所述待编辑视频上。

上述步骤103-104即可根据相应的处理指令，就自动实现目标片段插入待编辑视频，自动将目标片段覆盖在待编辑视频上。

本发明实施例中，在所述web页面中还提供了比例尺调整控件；在接收到对所述比例尺调整控件的调整操作后，调整所述视频片段编辑区域的显示精度。

参考图2，用户向左或向右拖动比例尺调整控件7，就可调节编辑区域中各轨道上的图像的显示精度。本领域技术人员也可根据实际需求设置调整控件的具体操作方式，对此不作具体限制。本发明实施例中所提供的调整比例尺调整控件可以精确到微秒（1:1000000），进一步提高了图像的显示精度，在对待编辑视频进行编辑时，不用关心因为精确度不够造成的误差，提高了用户的体验度。

在本发明实施例中，在web页面的视频片段编辑区域中，接收对目标片段的拖曳操作，在拖曳操作结束时，若目标片段位于第一时间线轨道中，就可根据是否接收到预设按键的指令来确定当前接收到的处理指令的类型，进而可将目标片段自动插入待编辑视频或覆盖在待编辑视频上，无需用户手动执行插入操作，用户体验度较高。同时，web页面的视频片段编辑区可自由实现插入功能或覆盖功能，避免了功能单一，灵活方便，用户可操作性更高。

参照图4，示出了本发明的另一种基于web页面的多媒体编辑方法的步骤流程图，本实施例进行了进一步优化，如图4所示，包括以下步骤：

步骤201：在web页面的视频片段编辑区域中，接收对目标片段所对应的第一图像元素的拖拽操作；

本发明实施例中，在编辑区域中的各个轨道中显示的仅是视频帧、音频、字幕这些元素所对应的图像，元素所对应的数据并不直接显示，而是储存在服务器中，在用户进行视频合成时，从服务器中获取相应的数据以生成视频。例如：视频帧轨道中显示的是待编辑视频的视频帧所对应的图像，音频轨道中显示的是待编辑视频的音频所对应的图像，字幕轨道显示的是待编辑视频的字幕所对应的图像，目标片段轨道中也显示的是目标片段的元素所对应的图像，即第一图像元素。而视频帧数据、音频帧数据、字幕数据、目标片段的元素数据均预先存储在服务器中。本步骤中，对目标片段所对应的第一图像元素的拖曳操作过程参考实施例一的说明，不再赘述。

步骤202：在所述拖拽操作结束时，若所述目标片段位于第一时间线轨道中，则确定当前接收到的处理指令的类型；其中，所述第一时间线轨道中显示有待编辑视频；

参考图2，视频帧轨道3、音频轨道4、字幕轨道5中的任一一个轨道均可作为第一时间线轨道。本步骤中，在第一时间线轨道中显示的为待编辑视频对应的待编辑图像元素。即，待编辑视频的元素所对应的图像。

步骤203：若所述处理指令的类型为插入指令，则根据所述第一图像元素在所述第一时间线轨道中的位置，将所述第一图像元素插入所述待编辑视频对应的待编辑图像元素中；

在本步骤中，仅是将目标片段的第一图像元素插入进了待编辑视频对应的待编辑图像元素中，其在编辑区的第一时间线轨道中呈现的仅是图形化显示。例如：执行音频插入操作时，在编辑区中所显示的仅是将目标音频片段所对应的波纹图像插入进了待编辑视频对应的音频波纹图像中，此时，web客户端需要与服务器交互以获取到音频图像对应的音频数据才能生成最终的音频。

步骤204：根据所述第一时间线轨道中插入后的待编辑图像元素，将所述目标片段插入所述待编辑视频；

参照图2，在用户将目标片段对应的第一图像元素插入待编辑视频对应的待编辑图像元素中之后，就得到了插入后的待编辑图像元素。此时，用户就可点击“导出视频”按钮以进入图3中的合成界面，通过合成得到编辑后的视频。

参照图3，提供了视频合成界面。在视频合成界面，具有输入名称栏、封面设置栏、发布平台栏、添加音频按钮、添加字幕按钮、添加视频画面按钮、确认合成按钮、取消按钮以及合成预览区域。输入名称栏可供用户自主为将要合成的视频命名。封面设置栏中可以选择本地图片或共享图片，以供用户为将要合成的视频设置封面。添加音频按钮、添加字幕按钮、添加视频画面按钮用以表示：在进行视频合成时，为插入/覆盖后的待编辑图像元素额外添加待编辑视频的其它元素。例如：用户在编辑区中执行的是将目标视频帧图像插入待编辑视频对应的待编辑视频帧图像中，在合成界面中，就可触发添加音频按钮和触发字幕按钮，以指示在合成视频时，在合成的视频帧图像中添加对应的音频和字幕。添加音频按钮、添加字幕按钮、添加视频画面按钮中的任一按钮被触发时，均呈现高亮显示。确认合成按钮和取消按钮则分别指示开始合成视频和取消合成视频。

本发明实施例中，web端本地具体通过以下方式得到编辑后的视频：

1）在执行编辑操作之前，根据第一时间线轨道，确定并保存目标片段所对应的第一图像元素在所属资源中的原始起始点和原始结束点，及确定插入前的待编辑图像元素中的各个图像元素片段在第一时间线轨道中的原始起始点和原始结束点。

2）在执行编辑操作之后，根据第一时间线轨道，再次确定并保存插入后的待编辑图像元素中的各个图像元素片段的现有起始点和现有结束点，及各个图像元素片段所属的资源标签。

3）建立出各个图像元素片段的位置对应关系和标记所属资源标签，例如：对于插入后的待编辑图像元素中的图像片段A，建立其原始起始点和现有起始点、原始结束点和现有结束点的位置对应关系，并为其对应关系标记图像片段A的所属资源标签，并将其封装得到封装包。如此重复操作，得到所有图像片段的封装包。

4）发送数据获取请求至服务器，其中，数据获取请求中包括了插入后的待编辑图像元素中的各个图像元素片段的封装包。即，用户在视频合成界面确认合成按钮后，就发送数据获取请求。

5）接收服务器返回的封装了目标资源数据的封装包。

6）获取各个封装包内的目标资源数据，并根据封装包中的现有起始点位置和现有结束点位置，确定出目标资源数据所对应的插入后的待编辑图像元素中的图像片段。

7）将目标资源数据与对应的插入后的待编辑图像元素中的图像片段合成以生成视频片段，并将各个视频片段拼接从而生成编辑后的视频。

上述过程中，服务器则通过以下方式与web端本地实现交互：

8）接收数据获取请求并进行解析，以从各个封装包中获取位置对应关系。

9）根据各个封装包中标记的资源标签，查找出与资源标签对应的各个完整资源数据；再根据各个封装包的位置对应关系中的原始起始点和原始结束点，从各个完整资源数据中截取出各自对应的目标资源数据。

10）将截取的各个目标资源数据封装进各自的封装包中，并将封装了目标资源数据的封装包返回给web端本地。

其中，服务器中会预先存储大量的资源数据，并且在web端本地的资源数据发生更新时（如我的资源中增加了视频资源），服务器也会对存储的资源数据进行对应更新。

本发明实施例中，在执行完步骤203得到插入后的待编辑图像元素后，web端本地就可通过与服务器之间的上述交互方式，来实现步骤204，以将目标片段插入待编辑视频，从而得到插入后的视频。

以下进行示例性说明：参考图2-3，若用户触发了公共资源控件b，web页面向服务器发送请求以获取到资源A-E，假设用户拖动资源A至第一时间线轨道中，将其作为待编辑视频，并拖动资源B至目标片段轨道中，最为要插入的资源A的新的插入片段。此时，web端就会执行上述1）步骤。而在用户将资源B拖动至第一时间线轨道中，且停止拖曳操作时，web端在此时就会执行上述2）-3）步骤。在用户停止编辑想要生成最终视频时，触发导出视频控件，web页面跳转至视频合成页面，用户点击确定合成按钮。此时，web 端就会执行上述4）步骤，而服务器就会相应执行上述8）-10）步骤，进而web端本地就会继续执行上述5）-7）步骤，以得到编辑后的视频。上述具体步骤的实现参考前述说明，在此不再赘述。

步骤205：若所述处理指令的类型为覆盖指令，则根据所述第一图像元素在所述第一时间线轨道中的位置，将所述第一图像元素覆盖在所述待编辑视频对应的待编辑图像元素上；

步骤206：根据所述第一时间线轨道中覆盖后的待编辑图像元素，将所述目标片段覆盖在所述待编辑视频上。

本发明实施例中，对于步骤205-206，除了实现的是覆盖操作，其余执行过程均可参考步骤203-204的实现方式，同样可通过web端本地与服务器交互的方式得到覆盖后的视频。

在本发明实施例中，在web页面的视频片段编辑区域中，接收对目标片段的第一图像元素的拖曳操作，在拖曳操作结束时，若目标片段位于第一时间线轨道中，就可根据是否接收到预设按键的指令来确定当前接收到的处理指令的类型，进而可将目标片段的第一图像元素自动插入或覆盖在待编辑图像元素上，再通过web端本地与服务器的交互，实现编辑后的视频的最终生成。无需用户手动执行插入操作，用户体验度较高。同时，web页面的视频片段编辑区可自由实现插入功能或覆盖功能，避免了功能单一，用户选择度更高。并且，由服务器承担一部分执行功能，分担了web端本地的压力，用户等待视频合成的时间较短。

参照图5，示出了将目标片段对应的第一图像元素插入待编辑视频对应的待编辑图像元素的流程图，其是在前述方案的基础上，对步骤203进行了进一步优化。

为了便于对方案的理解，本发明实施例中，均以插入视频帧图像为例来进行说明，而插入音频图像或字幕图像的实现方式，参照插入视频帧图像的实现方式即可。

如图5所示，步骤203中，若所述处理指令的类型为插入指令，则包括以下步骤：

步骤301：根据所述第一图像元素在所述第一时间线轨道中的位置，确定所述第一图像元素的插入起始点位置和插入结束点位置；

本发明实施例中，图6示出了在编辑区内，未接受拖曳操作的目标片段对应的第一图像元素和待编辑视频对应的待编辑图像元素的示意图。其中，目标片段对应的第一图像元素601显示在目标片段轨道2中，此时，第一图像元素601也就是目标视频帧图像片段。待编辑视频对应的待编辑图像元素片段602、603、604、605显示在视频帧轨道3中。此时，待编辑图像元素片段也就是待编辑视频帧图像片段。

本步骤中，参照图7a、图8a、图9a和图10a，示出了在编辑区内的拖曳操作结束时，目标视频帧图像片段与待编辑视频帧图像片段的不同位置关系。图7a中，当目标视频帧图像片段601与待编辑视频帧图像片段602部分重合时，目标视频帧图像片段601的插入起始点位置为71，插入结束点位置为72。图8a中，当目标视频帧图像片段601处于待编辑视频帧图像片段602和待编辑视频帧图像片段603之间时，目标视频帧图像片段601的插入起始点位置为81，插入结束点位置为82。图9a中，当目标视频帧图像片段601与待编辑视频帧图像片段603部分重合时，目标视频帧图像片段601的插入起始点位置为91，插入结束点位置为92。图10a中，当目标视频帧图像片段601与待编辑视频帧图像片段603完全重合时，目标视频帧图像片段601的插入起始点位置为101，插入结束点位置为102。

即，本发明实施例中，无论第一图像元素在第一时间线轨道中的位置如何，插入起始点位置和插入结束点位置也就是在用户对其拖曳操作结束时，第一图像元素的图像帧起始点和图像帧结束点分别映射在时间轴上的位置。

步骤302：根据所述插入起始点位置，在所述待编辑图像元素中，确定出所述插入起始点位置之后的待编辑图像元素片段；

本步骤中，参照图7a，位于插入起始点位置71之后的待编辑图像元素片段包括：标记点701所示的片段宽度、待编辑视频帧图像片段603、604和605。参照图8a，位于插入起始点位置81之后的待编辑图像元素片段包括：待编辑视频帧图像片段603、604和605。参照图9a，位于插入起始点位置91之后的待编辑图像元素片段包括：待编辑视频帧图像片段603、604和605。参照图10a，位于插入起始点位置101之后的待编辑图像元素片段包括：标记点1001所示的片段宽度，待编辑视频帧图像片段604和605。本发明实施例中，无论第一图像元素和待编辑图像元素的位置关系如何，只要有待编辑图像元素的片段位于第一图像元素的插入起始点位置之后，均视为需要向后移动的待编辑图像元素片段。

步骤303：将确定出的所述插入起始点位置之后的待编辑图像元素片段向后移动，直至移动到所述插入结束点位置之后；

本步骤中，参照图7b，将插入起始点位置71之后的标记点701所示的片段宽度、待编辑视频帧图像片段603、604和605向后至少移动的距离为：第一图像元素601的一个片段宽度。参照图8b，将插入起始点位置81之后的待编辑视频帧图像片段603、604和605可以不移动，直接插入第一图像元素601。参照图9b，将插入起始点位置91之后的待编辑视频帧图像片段603、604和605向后至少移动的距离为：标记点901所示的片段宽度。参照图10b，将插入起始点位置101之后的标记点1001所示的片段宽度，待编辑视频帧图像片段604和605向后至少移动的距离为：第一图像元素601的一个片段宽度。本领域技术人员也可根据实际需求来确定插入点位置之后的待编辑图像元素片段向后移动的距离，只要满足移动后均位于插入结束点位置之后即可，对此不作具体限制，均在本发明保护范围内。

步骤304：根据所述插入起始点位置和所述插入结束点位置，将所述第一图像元素显示在所述第一时间线轨道中。

本步骤中，根据步骤301中确定出的第一图像元素的插入起始点位置和插入结束点位置，将第一图像元素显示在第一时间线轨道中，就将第一图像元素插入进了待编辑视频对应的待编辑图像元素中。参照图7b、图8b、图9b和图10b，均显示出了不同位置中，第一图像元素插入待编辑图像元素片段后的效果。

在本发明实施例中，在具有前述方案中可将目标片段自动插入待编辑视频或覆盖在待编辑视频上，web页面的视频片段编辑区可自由实现插入功能或覆盖功能的效果基础上，进一步提出根据第一图像元素在第一时间线轨道中的位置，确定第一图像元素的插入起始点位置和插入结束点位置；根据插入起始点位置，在待编辑图像元素中，确定出插入起始点位置之后的待编辑图像元素片段；将出的所述插入起始点位置之后的待编辑图像元素片段向后移动，直至移动到插入结束点位置之后；根据插入起始点位置和插入结束点位置，将第一图像元素显示在第一时间线轨道中。即，无论第一图像元素与待编辑图像元素在第一时间线轨道中的位置关系如何，均通过确定出位于插入起始点位置之后的待编辑图像元素片段来实现第一图像元素的插入，使得插入方式更加快速便捷。

参照图11，示出了绝对布局展示界面中，将确定出的所述插入起始点位置之后的待编辑图像元素片段向后移动，直至移动到所述插入结束点位置之后的流程图。本实施例是在前述方案的基础上，从界面选型为绝对布局展示界面的角度对前述步骤303进行了进一步优化。

现有技术中，web端的界面选型通常为线性布局展示界面，而在根据第一图像元素在第一时间线轨道中的位置，将第一图像元素插入待编辑视频对应的待编辑图像元素时，通常采用以下方式实现：

为了便于理解，以图7a-图7b为例进行说明。在拖曳操作结束时，要实现第一图像元素601的插入，就需要将插入起始点71之后的各个待编辑图像元素片段，即标记点701所示的片段宽度、待编辑视频帧图像片段603、604和605均向后移动。而在向后移动时，也就需要重新确定插入起始点71之后的各个待编辑图像元素片段起始点位置和结束点位置。此时，由于采用的是线性布局展示界面，待编辑视频帧图像片段605重新确定的的起始点位置和结束点位置由待编辑视频帧图像片段604重新确定的起始点位置和结束点位置决定，而待编辑视频帧图像片段603重新确定的起始点位置和结束点位置由标记点701所示的片段宽度的重新确定的起始点位置和结束点位置决定，同样地，标记点701所示的片段宽度的重新确定的起始点位置和结束点则由第一图像元素601的插入起始点位置和插入结束点位置决定，第一图像元素601的插入起始点位置和插入结束点位置则由待编辑视频帧图像片段601中无需后移的部分片段宽度的起始点位置和结束点位置决定。即，在采用线性布局展示界面时，后一个图像元素片段的位置受前一个图像元素片段的位置影响，即各个图像元素片段之间相互制约，虽然采用此种方式可很好的处理web界面上的逻辑，但其每进行一次编辑操作，web客户端就需要维护大量数据。

本发明实施例中，为了避免对数据的大量维护。如图11所示，在采用绝对布局展示界面时，步骤303：将确定出的所述插入起始点位置之后的待编辑图像元素片段向后移动，直至移动到所述插入结束点位置之后，具体包括以下步骤：

步骤401：基于默认坐标原点，确定插入起始点位置之后的各个待编辑图像元素片段的起始点位置和结束点位置；

步骤402：根据预设移动距离，确定插入起始点位置之后的各个待编辑图像元素片段的现有起始点位置和现有结束点位置；其中，现有起始点位置为起始点位置与预设移动距离之和，现有结束点位置为起始点位置与预设移动距离之和；

步骤403：根据确定出的现有起始点位置和现有结束点位置，显示插入起始点位置之后的各个待编辑图像元素片段。

本实施例中，第一图像元素的插入起始点位置与插入结束点位置也是基于默认坐标原点确定出来的。本发明实施例中，默认坐标原点为时间线轨道中的时间轴上的（00:00:00:00）所在的位置，本领域技术人员可根据实际需求设置默认坐标原点。同样参照图7a-图7b为例，第一图像元素601、标记点701所示的片段宽度、待编辑视频帧图像片段603、604和605的位置均是各自基于默认坐标原点确定出来的，即各个图像片段的位置确定相互独立，不受影响。

在本发明实施例中，在具有前述方案中可快速便捷地将目标片段自动插入待编辑视频或覆盖在待编辑视频上，web页面的视频片段编辑区可自由实现插入功能或覆盖功能的效果基础上，进一步提出采用绝对布局展示界面，在向后移动插入点位置之后的待编辑图像元素片段时，基于默认坐标原点来确认各个待编辑图像元素片段的各自位置，使得web客户端需要维护的数据数量也会降低，提高编辑效率。

参照图12，示出了将目标片段对应的第一图像元素覆盖在待编辑视频对应的待编辑图像元素上的流程图，其是在前述方案的基础上，对步骤205进行了进一步优化。

如图12所示，步骤205中，若所述处理指令的类型为覆盖指令，则可以包括以下步骤：

步骤501：确定第一图像元素对所述第一时间线轨道中的待编辑图像元素的切割起始点位置和切割结束点位置；

本步骤中，第一图像元素对第一时间线轨道中的待编辑图像元素进行覆盖时，无论第一图像元素与待编辑图像元素的位置关系如何，只要进行覆盖操作，第一图像元素就会与第一时间线轨道中的待编辑图像元素产生交叠面积，此交叠面积的起始点位置就是第一图像元素对第一时间线轨道中的待编图像元素的切割起始点位置，交叠面积的结束点位置就是第一图像元素对第一时间线轨道中的待编辑图像元素的切割结束点位置。若第一图像元素同时与待编辑图像元素中的的多个待编辑图像片段产生交叠，则可具有多个交叠面积，此时就需要确定出各个交叠面积各自的切割起始点位置和切割结束点位置。

步骤502：根据所述切割起始点位置和所述切割结束点位置，删除所述切割起始点位置和所述切割结束点位置之间所对应的待编辑图像元素片段；

本步骤中，根据切割起始点位置和切割结束点位置，来删除两个位置之间所对应的待编辑图像片段，就等同于将第一图像元素与待编辑图像元素的交叠面积所对应的待编辑图像片段均进行了删除。

步骤503：根据所述第一图像元素在所述第一时间线轨道中的位置，确定所述目标片段的覆盖起始点位置和覆盖结束点位置；

步骤504：根据所述第一图像元素的覆盖起始点位置和覆盖结束点位置，将所述目第一图像元素显示在所述第一时间线轨道中。

在本发明实施例中，在具有前述方案中可将目标片段自动插入待编辑视频或覆盖在待编辑视频上，web页面的视频片段编辑区可自由实现插入功能或覆盖功能的效果基础上，进一步提出无论第一图像元素与待编辑图像元素在第一时间线轨道中的位置关系如何，均通过确定出第一图像元素与待编辑图像元素交叠面积对应的切起始点位置和切割结束点位置以进行切割并删除的操作，再将基于第一图像元素的覆盖起始点位置和覆盖结束点位置进行显示，使得覆盖方式更加快速便捷。

需要说明的是，对于方法实施例，为了简单描述，故将其都表述为一系列的动作组合，但是本领域技术人员应该知悉，本发明实施例并不受所描述的动作顺序的限制，因为依据本发明实施例，某些步骤可以采用其他顺序或者同时进行。其次，本领域技术人员也应该知悉，说明书中所描述的实施例均属于优选实施例，所涉及的动作并不一定是本发明实施例所必须的。

参照图13，示出了本发明的一种基于web页面的多媒体编辑装置的结构框图，该装置可以包括如下模块：

接收模块601，用于在web页面的视频片段编辑区域中，接收对目标片段的拖拽操作；

判断模块602，用于在所述拖拽操作结束时，若所述目标片段位于第一时间线轨道中，则确定当前接收到的处理指令的类型；其中，所述第一时间线轨道中显示有待编辑视频；

插入模块603，用于若所述处理指令的类型为插入指令，则根据所述目标片段在所述第一时间线轨道中的位置，将所述目标片段插入所述待编辑视频；

覆盖模块604，用于若所述处理指令的类型为覆盖指令，则根据所述目标片段在所述第一时间线轨道中的位置，将所述目标片段覆盖在所述待编辑视频上。

可选地，所述接收模块601，具体用于在web页面的视频片段编辑区域中，接收对目标片段所对应的第一图像元素的拖拽操作；

所述插入模块603，包括：

第一插入模块6031，用于若所述处理指令的类型为插入指令，则根据所述第一图像元素在所述第一时间线轨道中的位置，将所述第一图像元素插入所述待编辑视频对应的待编辑图像元素中；

第二插入模块6032，用于根据所述第一时间线轨道中插入后的待编辑图像元素，将所述目标片段插入所述待编辑视频；

所述覆盖模块604，包括：

第一覆盖模块6041，用于若所述处理指令的类型为覆盖指令，则根据所述第一图像元素在所述第一时间线轨道中的位置，将所述第一图像元素覆盖在所述待编辑视频对应的待编辑图像元素上；

第二覆盖模块6041，用于根据所述第一时间线轨道中覆盖后的待编辑图像元素，将所述目标片段覆盖在所述待编辑视频上。

可选地，所述第一插入模块6031，包括：

第一确定模块60311，用于根据所述第一图像元素在所述第一时间线轨道中的位置，确定所述第一图像元素的插入起始点位置和插入结束点位置；

第二确定模块60312，用于根据所述插入起始点位置，在所述待编辑图像元素中，确定出所述插入起始点位置之后的待编辑图像元素片段；

移动模块60313，用于将确定出的所述插入起始点位置之后的待编辑图像元素片段向后移动，直至移动到所述插入结束点位置之后；

第一显示模块60314，用于根据所述插入起始点位置和所述插入结束点位置，将所述第一图像元素显示在所述第一时间线轨道中。

可选地，所述判断模块包括：

第一指令判断模块，用于在所述拖拽操作结束时，若所述目标片段位于第一时间线轨道中，且接收到预设按键的指令，则确定当前接收到的处理指令为插入指令；

第二指令判断模块，用于在所述拖拽操作结束时，若所述目标片段位于第一时间线轨道中，且未接收到预设按键的指令，则确定当前接收到的处理指令为覆盖指令。

可选地，所述装置还包括：

在所述web页面中提供比例尺调整控件；

在接收到对所述比例尺调整控件的调整操作后，调整所述视频片段编辑区域的显示精度。

综上所述，本发明实施例提供的基于web页面的多媒体编辑装置，在web页面的视频片段编辑区域中，接收对目标片段的第一图像元素的拖曳操作，在拖曳操作结束时，若目标片段位于第一时间线轨道中，就可根据是否接收到预设按键的指令来确定当前接收到的处理指令的类型，进而可将目标片段的第一图像元素自动插入或覆盖在待编辑图像元素上，实现将目标片段插入待编辑视频或覆盖在待编辑视频上。无需用户手动执行插入操作，用户体验度较高。同时，web页面的视频片段编辑区可自由实现插入功能或覆盖功能，避免了功能单一，用户选择度更高。

如图14所示，本发明实施例还提供了一种电子设备M00，包括处理器M02、存储器M01及存储在所述存储器M01上并可在所述处理器M02上运行的计算机程序或指令，该程序或指令被处理器M02执行时实现上述基于web页面的多媒体编辑方法的各个过程，且能达到相同的技术效果，为避免重复，这里不再赘述。

参照图15，示出了实现本申请的一种电子设备的硬件结构示意图。

该电子设备1500包括但不限于：射频单元1501、网络模块1502、音频输出单元1503、输入单元1504、传感器1505、显示单元1506、用户输入单元1507 、接口单元1508、存储器1509、以及处理器1510等部件。

本领域技术人员可以理解，电子设备1500还可以包括给各个部件供电的电源（比如电池），电源可以通过电源管理系统与处理器1510逻辑相连，从而通过电源管理系统实现管理充电、放电、以及功耗管理等功能。图15中示出的电子设备结构并不构成对电子设备的限定，电子设备可以包括比图示更多或更少的部件，或者组合某些部件，或者不同的部件布置，在此不再赘述。

可选的，本发明提供了一种可读存储介质，所述可读存储介质上存储有程序或指令，该程序或指令被处理器执行时实现上述基于web页面的多媒体编辑方法的各个过程，且能达到相同的技术效果，为避免重复，这里不再赘述。

其中，所述处理器为上述实施例中所述的电子设备中的处理器。所述可读存储介质，包括计算机可读存储介质，如计算机只读存储器（Read-Only Memory， ROM）、随机存取存储器（Random Access Memory， RAM）、磁碟或者光盘等。

本说明书中的各个实施例均采用递进的方式描述，每个实施例重点说明的都是与其他实施例的不同之处，各个实施例之间相同相似的部分互相参见即可。

本领域技术人员易于想到的是：上述各个实施例的任意组合应用都是可行的，故上述各个实施例之间的任意组合都是本发明的实施方案，但是由于篇幅限制，本说明书在此就不一一详述了。

在此处所提供的说明书中，说明了大量具体细节。然而，能够理解，本发明的实施例可以在没有这些具体细节的情况下实践。在一些实例中，并未详细示出公知的方法、结构和技术，以便不模糊对本说明书的理解。

类似地，应当理解，为了精简本发明并帮助理解各个发明方面中的一个或多个，在上面对本发明的示例性实施例的描述中，本发明的各个特征有时被一起分组到单个实施例、图、或者对其的描述中。然而，并不应将该公开的方法解释成反映如下意图：即所要求保护的本发明要求比在每个权利要求中所明确记载的特征更多的特征。更确切地说，如权利要求书所反映的那样，发明方面在于少于前面公开的单个实施例的所有特征。因此，遵循具体实施方式的权利要求书由此明确地并入该具体实施方式，其中每个权利要求本身都作为本发明的单独实施例。

本领域那些技术人员可以理解，可以对实施例中的设备中的模块进行自适应性地改变并且把它们设置在与该实施例不同的一个或多个设备中。可以把实施例中的模块或单元或组件组合成一个模块或单元或组件，以及此外可以把它们分成多个子模块或子单元或子组件。除了这样的特征和/或过程或者单元中的至少一些是相互排斥之外，可以采用任何组合对本说明书（包括伴随的权利要求、摘要和附图）中公开的所有特征以及如此公开的任何方法或者设备的所有过程或单元进行组合。除非另外明确陈述，本说明书（包括伴随的权利要求、摘要和附图）中公开的每个特征可以由提供相同、等同或相似目的的替代特征来代替。

此外，本领域的技术人员能够理解，尽管在此所述的一些实施例包括其它实施例中所包括的某些特征而不是其它特征，但是不同实施例的特征的组合意味着处于本发明的范围之内并且形成不同的实施例。例如，在权利要求书中，所要求保护的实施例的任意之一都可以以任意的组合方式来使用。

应该注意的是上述实施例对本发明进行说明而不是对本发明进行限制，并且本领域技术人员在不脱离所附权利要求的范围的情况下可设计出替换实施例。在权利要求中，不应将位于括号之间的任何参考符号构造成对权利要求的限制。单词“包含”不排除存在未列在权利要求中的元件或步骤。位于元件之前的单词“一”或“一个”不排除存在多个这样的元件。本发明可以借助于包括有若干不同元件的硬件以及借助于适当编程的计算机来实现。在列举了若干装置的单元权利要求中，这些装置中的若干个可以是通过同一个硬件项来具体体现。单词第一、第二、以及第三等的使用不表示任何顺序。可将这些单词解释为名称。

Claims (10)

1.一种基于web页面的多媒体编辑方法，其特征在于，包括：

在web页面的视频片段编辑区域中，接收对目标片段的拖拽操作；

在所述拖拽操作结束时，若所述目标片段位于第一时间线轨道中，则确定当前接收到的处理指令的类型；其中，所述第一时间线轨道中显示有待编辑视频；

若所述处理指令的类型为插入指令，则根据所述目标片段在所述第一时间线轨道中的位置，将所述目标片段插入所述待编辑视频；

若所述处理指令的类型为覆盖指令，则根据所述目标片段在所述第一时间线轨道中的位置，将所述目标片段覆盖在所述待编辑视频上。

2.根据权利要求1所述的方法，其特征在于，所述接收对目标片段的拖拽操作，包括：

接收对目标片段所对应的第一图像元素的拖拽操作；

所述根据所述目标片段在所述第一时间线轨道中的位置，将所述目标片段插入所述待编辑视频，包括：

根据所述第一图像元素在所述第一时间线轨道中的位置，将所述第一图像元素插入所述待编辑视频对应的待编辑图像元素中；

根据所述第一时间线轨道中插入后的待编辑图像元素，将所述目标片段插入所述待编辑视频；

所述根据所述目标片段在所述第一时间线轨道中的位置，将所述目标片段覆盖在所述待编辑视频上，包括：

根据所述第一图像元素在所述第一时间线轨道中的位置，将所述第一图像元素覆盖在所述待编辑视频对应的待编辑图像元素上；

根据所述第一时间线轨道中覆盖后的待编辑图像元素，将所述目标片段覆盖在所述待编辑视频上。

3.根据权利要求2所述的方法，其特征在于，所述根据所述第一图像元素在所述第一时间线轨道中的位置，将所述第一图像元素插入所述待编辑视频对应的待编辑图像元素中的步骤，包括：

根据所述第一图像元素在所述第一时间线轨道中的位置，确定所述第一图像元素的插入起始点位置和插入结束点位置；

根据所述插入起始点位置，在所述待编辑图像元素中，确定出所述插入起始点位置之后的待编辑图像元素片段；

将确定出的所述插入起始点位置之后的待编辑图像元素片段向后移动，直至移动到所述插入结束点位置之后；

根据所述插入起始点位置和所述插入结束点位置，将所述第一图像元素显示在所述第一时间线轨道中。

4.根据权利要求1所述的方法，其特征在于，所述在所述拖拽操作结束时，若所述目标片段位于第一时间线轨道中，则确定当前接收到的处理指令的类型的步骤，包括：

在所述拖拽操作结束时，若所述目标片段位于第一时间线轨道中，且接收到预设按键的指令，则确定当前接收到的处理指令为插入指令；

在所述拖拽操作结束时，若所述目标片段位于第一时间线轨道中，且未接收到预设按键的指令，则确定当前接收到的处理指令为覆盖指令。

5.根据权利要求1所述的方法，其特征在于，包括：

在所述web页面中提供比例尺调整控件；

在接收到对所述比例尺调整控件的调整操作后，调整所述视频片段编辑区域的显示精度。

6.一种基于web页面的多媒体编辑装置，其特征在于，包括：

接收模块，用于在web页面的视频片段编辑区域中，接收对目标片段的拖拽操作；

判断模块，用于在所述拖拽操作结束时，若所述目标片段位于第一时间线轨道中，则确定当前接收到的处理指令的类型；其中，所述第一时间线轨道中显示有待编辑视频；

插入模块，用于若所述处理指令的类型为插入指令，则根据所述目标片段在所述第一时间线轨道中的位置，将所述目标片段插入所述待编辑视频；

覆盖模块，用于若所述处理指令的类型为覆盖指令，则根据所述目标片段在所述第一时间线轨道中的位置，将所述目标片段覆盖在所述待编辑视频上。

7.根据权利要求6所述的多媒体编辑装置，其特征在于，

所述接收模块，具体用于在web页面的视频片段编辑区域中，接收对目标片段所对应的第一图像元素的拖拽操作；

所述插入模块，包括：

第一插入模块，用于若所述处理指令的类型为插入指令，则根据所述第一图像元素在所述第一时间线轨道中的位置，将所述第一图像元素插入所述待编辑视频对应的待编辑图像元素中；

第二插入模块，用于根据所述第一时间线轨道中插入后的待编辑图像元素，将所述目标片段插入所述待编辑视频；

所述覆盖模块，包括：

第一覆盖模块，用于若所述处理指令的类型为覆盖指令，则根据所述第一图像元素在所述第一时间线轨道中的位置，将所述第一图像元素覆盖在所述待编辑视频对应的待编辑图像元素上；

第二覆盖模块，用于根据所述第一时间线轨道中覆盖后的待编辑图像元素，将所述目标片段覆盖在所述待编辑视频上。

8.根据权利要求7所述的多媒体编辑装置，其特征在于，所述第一插入模块，包括：

第一确定模块，用于根据所述第一图像元素在所述第一时间线轨道中的位置，确定所述第一图像元素的插入起始点位置和插入结束点位置；

第二确定模块，用于根据所述插入起始点位置，在所述待编辑图像元素中，确定出所述插入起始点位置之后的待编辑图像元素片段；

移动模块，用于将确定出的所述插入起始点位置之后的待编辑图像元素片段向后移动，直至移动到所述插入结束点位置之后；

第一显示模块，用于根据所述插入起始点位置和所述插入结束点位置，将所述第一图像元素显示在所述第一时间线轨道中。

9.一种电子设备，其特征在于，包括处理器、存储器及存储在所述存储器上并可在所述处理器上运行的计算机程序，所述计算机程序被处理器执行时实现如权利要求1-5任一项所述的基于web页面的多媒体编辑方法的步骤。

10.一种计算机可读存储介质，其特征在于，所述计算机可读存储介质上存储计算机程序，所述计算机程序被处理器执行时实现如权利要求1-5任一项所述的基于web页面的多媒体编辑方法的步骤。

Images