View
220
Download
1
Embed Size (px)
Citation preview
MathEdit, MathEdit, A Browser-based Visual Mathematics A Browser-based Visual Mathematics Expression EditorExpression Editor
Wei Su1, Paul.Wang2, Lian Li1, Guanyu Li1, Yanjuan Zhao1
1Lanzhou University, Lanzhou, Gansu,730000, China2 Kent State University, Kent, Ohio 44242-0001, USA
WME Group
http://wme.cs.kent.edu Or http://wme.lzu.edu.cn
OutlineOutline
1. Background
2. MathEdit Overview
3. MathEdit Architecture and Components
4. Internal Design and Implementation
5. Extensibility and Customization
6. MathEdit API library
7. Future Work
WME Group
http://wme.cs.kent.edu Or http://wme.lzu.edu.cn
1. Background1. Background
WME Group
http://wme.cs.kent.edu Or http://wme.lzu.edu.cn
2. MathEdit Overview2. MathEdit Overview
MathEdit is an interactive visual mathematical expression editor. Running in a Web browser, it allows you to create and edit mathematical expressions with a convenient and intuitive graphical user interface. With MathEdit, users can easily enter mathematical expressions as answers to questions in mathematics lesson pages for example. Web page authors can also use MathEdit to create mathematical expressions to be included in their XHTML documents.
WME Group
http://wme.cs.kent.edu Or http://wme.lzu.edu.cn
2. MathEdit Overview2. MathEdit Overview MathEdit Toolbar
Editing Area Templates
Editing Mode
WME Group
http://wme.cs.kent.edu Or http://wme.lzu.edu.cn
Main FunctionalitiesMain Functionalities Create a new or edit an existing mathematical expression
interactively with a convenient GUI
Direct editing of MathML code
Set mathematical expression format and style
Customize toolbar, palette and expression template
Import/Export MathML
– Capture and retrieve the MathML markup from other applications or webpage.
– Open an existing MathML file stored in the local file system or at the originating Web server
– Save MathML in a local or remote file
– Return the result mathematical encoding (content, presentation, and composite) to the parent window
WME Group
http://wme.cs.kent.edu Or http://wme.lzu.edu.cn
Some Examples of Math expressionSome Examples of Math expression
Demo
WME Group
http://wme.cs.kent.edu Or http://wme.lzu.edu.cn
3. MathEdit Architecture and Components3. MathEdit Architecture and Components
WME Group
http://wme.cs.kent.edu Or http://wme.lzu.edu.cn
4. Internal Design and Implementation4. Internal Design and Implementation
4.1 Template
4.2 Sub-expression Navigation
4.3 Command Processing
WME Group
http://wme.cs.kent.edu Or http://wme.lzu.edu.cn
4.1 Template 4.1 Template
Fraction Template
Limit Template
WME Group
http://wme.cs.kent.edu Or http://wme.lzu.edu.cn
4.2 Sub-expression Navigation4.2 Sub-expression Navigation
•MathEdit keeps track of the sub-expression and displays a color background to visually identify it to the user.
•The arrow keys are used to move the current sub-expression
up to the parent node
down to the first child
left/right to sibling nodes.
WME Group
http://wme.cs.kent.edu Or http://wme.lzu.edu.cn
4.3 Command Processing 4.3 Command Processing
apply
math
divide ci cidivide
root
apply
math
cn
cnplus ci ci
degree apply
apply
ba
2
2
cn
apply
math
divide
root degree ci
apply
ci
2
ci
math
2
a bthe DOM trees in creating
WME Group
http://wme.cs.kent.edu Or http://wme.lzu.edu.cn
5. Extensibility and Customization 5. Extensibility and Customization
MiddleSchool
HighSchool
TriangleFunctionCurricula
SetCurricula
WME Group
http://wme.cs.kent.edu Or http://wme.lzu.edu.cn
6. MathEdit API library6. MathEdit API library
Demo1_popup Demo2_embed
MathEdit
WME Group
http://wme.cs.kent.edu Or http://wme.lzu.edu.cn
MathEdit API libraryMathEdit API libraryMethod Description
newMath( id, parentId ) Create a new MathML expression.
–id: the id of the new math expression .
–parentId: the id of the element where the Math expression will be appended on.
setIframe(iframeID,matheditURL)
Set a Iframe with a ID attribute to Embed MathEdit to your Web.
– iframeID: The ID attribute value of the iframe.
– matheditURL: The URL of MathEdit tool. editMathById( id ) Edit an existing Math Expression by ID.
–Id: the id of the existing math expression .
ShowTemplate(templateID) Display the Math template by template ID.
–templateID: the ID of the template.
ShowToolbar(toolID) Display the tool button by ID.
– toolID: the ID of the tool button.
setEditorSize(width,height) Set the size of editor area.
WME Group
http://wme.cs.kent.edu Or http://wme.lzu.edu.cn
MathEdit API libraryMathEdit API library
Method Description
loadContentMath(filename ) Load Content MathML from a file
loadPresentationMath(filename )
Load Presentation MathML from a file
loadInfixMath(filename ) Load Infix math expression from a file
editContentMath(String) Load Content MathML from a string
editPresentationMath(String) Load Presentation MathML from a string
editInfixMath(String) Load Infix math expression from a string
getContentMathML () Return Content MathML to host procedure
getPresentationMathML() Return Presentation MathML to host procedure
getInfixMathML () Return Presentation MathML to host procedure
getLatexMathML () Return Latex Math expression to host procedure
WME Group
http://wme.cs.kent.edu Or http://wme.lzu.edu.cn
Thank you!