1"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[6907],{84295:(e,n,t)=>{t.r(n),t.d(n,{assets:()=>l,contentTitle:()=>s,default:()=>d,frontMatter:()=>o,metadata:()=>c,toc:()=>r});var i=t(85893),a=t(11151);const o={sidebar_position:3},s="Math Equation Animations",c={id:"tutorials/dynamic/equation",title:"Math Equation Animations",description:"Touying also provides a unique and highly useful feature\u2014math equation animations, allowing you to conveniently use pause and meanwhile within math equations.",source:"@site/docs/tutorials/dynamic/equation.md",sourceDirName:"tutorials/dynamic",slug:"/tutorials/dynamic/equation",permalink:"/docs/tutorials/dynamic/equation",draft:!1,unlisted:!1,editUrl:"https://github.com/touying-typ/touying/tree/main/docs/en/tutorials/dynamic/equation.md",tags:[],version:"current",sidebarPosition:3,frontMatter:{sidebar_position:3},sidebar:"tutorialSidebar",previous:{title:"Complex Animations",permalink:"/docs/tutorials/dynamic/complex"},next:{title:"Cover Function",permalink:"/docs/tutorials/dynamic/cover"}},l={},r=[{value:"Simple Animation",id:"simple-animation",level:2},{value:"Complex Animation",id:"complex-animation",level:2}];function u(e){const n={code:"code",h1:"h1",h2:"h2",img:"img",p:"p",pre:"pre",...(0,a.a)(),...e.components};return(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(n.h1,{id:"math-equation-animations",children:"Math Equation Animations"}),"\n",(0,i.jsxs)(n.p,{children:["Touying also provides a unique and highly useful feature\u2014math equation animations, allowing you to conveniently use ",(0,i.jsx)(n.code,{children:"pause"})," and ",(0,i.jsx)(n.code,{children:"meanwhile"})," within math equations."]}),"\n",(0,i.jsx)(n.h2,{id:"simple-animation",children:"Simple Animation"}),"\n",(0,i.jsx)(n.p,{children:"Let's start with an example:"}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-typst",children:"#slide[\n Touying equation with pause:\n\n $\n f(x) &= pause x^2 + 2x + 1 \\\n &= pause (x + 1)^2 \\\n $\n\n #meanwhile\n\n Touying equation is very simple.\n]\n"})}),"\n",(0,i.jsx)(n.img,{alt:"Touying example output",src:t(55051).Z+"",width:"3440",height:"1966"}),"\n",(0,i.jsxs)(n.p,{children:["We use the ",(0,i.jsx)(n.code,{children:"touying-equation"})," function to incorporate ",(0,i.jsx)(n.code,{children:"pause"})," and ",(0,i.jsx)(n.code,{children:"meanwhile"})," within the text of math equations (in fact, you can also use ",(0,i.jsx)(n.code,{children:"#pause"})," or ",(0,i.jsx)(n.code,{children:"#pause;"}),")."]}),"\n",(0,i.jsx)(n.p,{children:"As you would expect, the math equation is displayed step by step, making it suitable for presenters to demonstrate their math reasoning."}),"\n",(0,i.jsx)(n.h2,{id:"complex-animation",children:"Complex Animation"}),"\n",(0,i.jsxs)(n.p,{children:["In fact, we can also use ",(0,i.jsx)(n.code,{children:"only"}),", ",(0,i.jsx)(n.code,{children:"uncover"}),", and ",(0,i.jsx)(n.code,{children:"alternatives"}),":"]}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-typst",children:'#slide(repeat: 3, self => [\n #let (uncover, only, alternatives) = utils.methods(self)\n\n $\n f(x) &= pause x^2 + 2x + uncover("3-", 1) \\\n &= pause (x + 1)^2 \\\n $\n])\n'})}),"\n",(0,i.jsx)(n.img,{alt:"Touying example output",src:t(90846).Z+"",width:"3440",height:"1966"})]})}function d(e={}){const{wrapper:n}={...(0,a.a)(),...e.components};return n?(0,i.jsx)(n,{...e,children:(0,i.jsx)(u,{...e})}):u(e)}},90846:(e,n,t)=>{t.d(n,{Z:()=>i});const i=t.p+"assets/images/2fbe4f38-2a1196aa3f42fefdb00d19ff4e515e8d.png"},55051:(e,n,t)=>{t.d(n,{Z:()=>i});const i=t.p+"assets/images/3b4adbbe-d59311837d2a4267dfce6edf10c99ca1.png"},11151:(e,n,t)=>{t.d(n,{Z:()=>c,a:()=>s});var i=t(67294);const a={},o=i.createContext(a);function s(e){const n=i.useContext(o);return i.useMemo((function(){return"function"==typeof e?e(n):{...n,...e}}),[n,e])}function c(e){let n;return n=e.disableParentContext?"function"==typeof e.components?e.components(a):e.components||a:s(e.components),i.createElement(o.Provider,{value:n},e.children)}}}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.