TexSpireJs

为程序员定制的网页播放和演示组件

A JavaScript library for building html presentations.

You can build some simple components through TexSpireJs without writing html+css code

TexSpireJs是一个使用js制作像ppt一样播放网页的组件库，内置了很多基础的组件如：列表、表格、折线图、词云图、柱状图等等，你完全可以通过js api创建基础的组件，而不需要自己写html代码

演示

使用TexSpire制作的演示文档

如果阁下需要一个更优雅和简单的文字生成演示效果的在线工具，请参考TexSpire

使用参考

1、基础用法，参考base.html

2、图表用法，参考chart.html

教程

引入依赖

<link rel="styleSheet" type="text/css" href="../src/TexSpire.css">
<script src="../src/TexSpire.js"></script>

定义容器

<div id="viewpages"></div>

初始化

window.onload = function () {
    /*初始化TexSpire*/
    let texSpire = new TexSpire('viewpages');
}

添加内容

添加第一页

 /*创建一个普通页面 设置为居中（也可以设置为left）*/
texSpire.createPage("文本框演示", "Huoyo", "center");
/*设置第0页组件排列方向 h为横向 v为纵向*/
texSpire.setContentDirection(0, 'h');
/*在第0页添加一个有标题的文本框*/
texSpire.createTitleTextToPage(0, "文本标题", "文本内容", 400, 400);

添加第二页

texSpire.createPage("列表演示", "Huoyo", "center");
texSpire.setContentDirection(1, 'h')
texSpire.createListCardToPage(1, "列表标题", ['任务1', '任务2'], 'radio', 400, 400)

播放

/*从第0页开始播放*/
texSpire.playPage(0);