☰

使用 tex 生成带有嵌入视频的 html 页面，可以吗？

tag-icon • tag-icon tex4ht javascript latex2html
使用 tex 生成带有嵌入视频的 html 页面，可以吗？

我想使用 tex 生成带有嵌入视频的 html 页面。我知道我可以使用 latex2html 将 tex 转换为 html。我也知道 media9，但我认为它只能用于以 pdf 格式呈现视频。我认为如果 javascript 可以嵌入到 tex 中并呈现为 html，那么我可以使用基于 javascript 的视频播放器在 html 页面中显示视频。那么这可能吗？

我为什么要这样做？：我想在我的文档中添加视频，但 pdf 标准及其相关查看器对此的间歇性支持让我感到沮丧。

答案1

解决方案使用tex4ht。示例文档：

\documentclass{article}
\usepackage{media9}
\newcommand\myvideo[3]{%
\includemedia[%
addresource=#3,
width=#1,
height=#2,
activate=pageopen
]{}{VPlayer.swf}
}
\begin{document}
\myvideo{.5\linewidth}{.5\linewidth}{circle.mp4}
\end{document}

\myvideo引入了命令，有三个参数width，height和video file。media9命令\includemedia用于包含视频。我无法测试它是否有效，因为 Linux 不支持视频播放。

现在我们需要为 创建配置文件tex4ht，名为media.cfg，在其中我们将重写\myvideo命令来生成视频 html 标签。

\Preamble{xhtml}
\begin{document}
\renewcommand\myvideo[3]{%
\HCode{%
<embed src="#3" type="video/mp4" WIDTH="\the\dimexpr#1\relax" HEIGHT="\the\dimexpr#2\relax" AUTOPLAY="TRUE" LOOP="TRUE" PLAYEVERYFRAME="TRUE" />
}
}
\EndPreamble

<embed>元素被使用，因为它受到广泛支持。请注意，type参数被硬编码为video/mp4，如果您的视频类型不同，则需要更改它。\dimexpr用于计算尺寸。

现在你可以使用以下命令编译该文档：

htlatex sample.tex media

并生成 html：

<?xml version="1.0" encoding="utf-8" ?> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<!--http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd-->  
<html xmlns="http://www.w3.org/1999/xhtml"  
> 
<head> <title></title> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<meta name="generator" content="TeX4ht (http://www.cse.ohio-state.edu/~gurari/TeX4ht/)" /> 
<meta name="originator" content="TeX4ht (http://www.cse.ohio-state.edu/~gurari/TeX4ht/)" /> 
<!-- charset=utf-8,html,xhtml --> 
<meta name="src" content="sample.tex" /> 
<meta name="date" content="2014-05-09 13:45:00" /> 
<link rel="stylesheet" type="text/css" href="sample.css" /> 
</head><body 
>
<!--l. 12--><p class="noindent" ><embed src="circle.mp4" type="video/mp4" WIDTH="172.5pt" HEIGHT="172.5pt" AUTOPLAY="TRUE" LOOP="TRUE" PLAYEVERYFRAME="TRUE" />  </p> 
</body></html>

答案2

感谢 David Carlisle 的建议以及 michal.h21 使用 tex4ht 的解决方案。下面是 latex2html 的解决方案。

我使用 latex2html 的 rawhtml 环境编写了一个放置 html5 视频文件的环境（它尝试 mp4 和 ogg 格式）

\documentclass[english]{article}
\newcommand{\vid}[1] {   
\begin{rawhtml}
<video width="320" height="240" controls>   
\end{rawhtml}
\begin{rawhtml}
<source src="
\end{rawhtml}
#1
\begin{rawhtml}
.ogg" type="video/ogg"> 
\end{rawhtml}
\begin{rawhtml}
<source src="
\end{rawhtml}
#1
\begin{rawhtml}
.mp4" type="video/mp4"> 
\end{rawhtml}
\begin{rawhtml}
Your browser does not support the video tag. </video>
\end{rawhtml}
}
\begin{document}
%now use the environment defined above to place 
%a video called myVidName.mp4 or myVidName.ogg
\vid{myVidName}
\end{document}

相关内容