Overview

Math Widget is an interactive input method, enabling users to smoothly handwrite mathematical operations and equations, which can then be typeset and solved. Based on MyScript Math SDK, it displays its features in a user-friendly interface.

Math Widget is designed to ensure a natural, handwriting-based HMI with real-time recognition and ink editing gestures. It also offers all the calculation features of a common scientific calculator, including exponential and trigonometric functions.

Use cases

The below use cases are only examples of applications where Math Widget has been used, sometimes with additional features. Note that all available features are listed in the API.

MyScript Calculator

MyScript Calculator is an handwriting calculator based on MyScript Math. In this scenario, the user handwrites mathematical operations and equations. Handwritten input is converted into a digital text formula. The widget can also solve simple arithmetic and trigonometric formulas, returning a calculated result. The content of the displays can be exported as an image or as a MathML or LaTeX string.

MyScript MathPad

MyScript MathPad is a handwriting LaTeX generator based on MyScript Math. It allows you to handwrite your equations and mathematical expressions and convert them for easy sharing.

Features

Real-time recognition of symbols and rules
Real-time recognition of mathematical rules and more than 200 mathematical symbols and characters.

Typeset rendering
Captured handwritten equations can be rendered to typeset equations in real-time. Rendering can be customized (font, color, background, etc.).

Editing gestures
Correction (strikethrough, scratch-out) can be applied on both original handwritten text and typeset text. They can also be deactivated if needed. Undo/redo features are supported.

LaTeX, MathML, image and text results
Results are available as LaTeX, MathML, image and text.

Solver activation
Entered equations can be solved and question marks are supported as unknown variables. Rounding and truncation options are available.

Save and restore
Save and restore your equation in MyScript Math format.

Supported symbols

See below a non-exhaustive list of supported symbols.

It is also possible to create a custom grammar resource, by constraining the recognition for particular use cases (integral calculus, vector calculus, finite element calculus, etc.). For more information, see the Developer tools page.

Type of item  Items
Letters (Latin alphabet) a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z
Digits 0 1 2 3 4 5 6 7 8 9
Mathematical symbols (including operators)  € $ £ ¥ ₩ ¢ ( ) < > [ ] { }  ! # % & ? @ / \ | ∥ © ∂∅ ∇ ∞ ℂ ℕ ℚ ℝ ℤ + - ± × ÷ * ∘ · = ‘ , .  : ; _ ← ↑ → ↓ ↔ ↕ ↖ ↗ ↘ ↙⇐ ⇑ ⇒ ⇓ ⇔ ⇕ ∀ ∃ ∄ ∈ ∉ ∋ ∌ ∪ ∩ ⊂ ⊃ ⊄ ⊅ ∼ ≃ ≈ ≠ ≡ ≢ ≤ ≥ ≪ ≫ ∝ ∠ ∏ ∑ ∫ ∫∫ ∫∫∫ ∮ ∯ ∰ ∧ √l ⊕ ⊗ ⊖ ⊙ ¬Ψℑℜℓ↼⇀↽⇁⇋⇌∐∦≄≅≆≇≉≮≯≰≱⋉⋊⋮⌈⌉ ⌊⌋□ △ ⟦ ⟧ ⦞ 𝔻 ⫻
Greek symbols frequently used in mathematics Γ Δ Ω α β γ δ ε η θ λ ν π ρ σ τ φ χ ψ ω ϕ µ
Mathematical terms sin cos tan sinh cosh tanh arcsin arccos arctan cot coth min max arg argmin argmax inf sup lim liminf limsup ln log dx dy dz dt
International convention units (weight, length, frequency, luminosity, dosage, pressure, etc.) km hm dam dm cm mm µm ha hl dal dl cl ml µl kg hg dag dg cg mg µg ms µs GHz MHz kHz Hz

Supported rules

Each grammar sets out a number of production rules for equations, namely:

Type of rule Written example Recognition
Horizontal pair 2x
Fence (2x)+3
Square root 388
Fraction 2x+4 5y-2 _____
Subscript x i
Superscript
Subsuperscript i-1
Presuperscript 625 n
Overscript Σ n
Underscript Σ x=0
Underoverscript Σ j=1 n

Supported operations

The solver is activated only if the equation contains numbers and/or fractions and at least one of the following operators:

Input and output formats

It is possible to reload a result, using a symbol list or some binary data previously generated.

Math Widget also offers the possibility to export results in 5 different formats:

  • Math Widget symbol list
  • Binary data
  • Image
  • LaTeX

    \dfrac {-b\pm \sqrt {b^{2}-4ac}}{2a}

  • MathML
<math xmlns='http://www.w3.org/1998/Math/MathML'>
  <mfrac>
    <mrow>
      <mo> - </mo>
      <mi> b </mi>
      <mo> &#x00B1; <!-- plus-minus sign --> </mo>
      <msqrt>
        <msup>
          <mrow>
            <mi> b </mi>
          </mrow>
          <mrow>
            <mn> 2 </mn>
          </mrow>
        </msup>
        <mo> - </mo>
        <mn> 4 </mn>
        <mi> a </mi>
        <mi> c </mi>
      </msqrt>
    </mrow>
    <mrow>
      <mn> 2 </mn>
      <mi> a </mi>
    </mrow>
  </mfrac>
</math>

Display modes

No beautification

Characters stay handwritten until solving is activated manually, if needed. Text is then typeset and solved at the same time.

Typeset

Characters are automatically typeset after a short delay, using standard math fonts or custom fonts. If needed, solving has to be activated manually.

Typeset and solve

Characters are typeset after a short delay, using standard math fonts or custom fonts. The whole operation is solved, provided that its characters are supported by the solver (see above).

Integration

General information about ATK (licenses, samples, etc.) is available in the ATK Overview section.
Please make sure to use at least Visual Studio 2015 Update 1 and Windows 10. Note that the below procedure may vary depending on your Visual Studio version.

Step 1 - Download your Certificate

  1. Log in at https://atk.myscript.com.
  2. In the Applications tab, click Create application.
  3. Enter your application name and its description, then click Create.
  4. Click Open, then Create certificate.
  5. Enter the package name that can be found in Package.appxmanifest (Packaging tab) and select the target environment, then click Create.
  6. Click on the .cs download icon to download the corresponding certificate.
  7. Paste it in your project and start creating your app.
You need one certificate per application and per platform. You can integrate several widgets in one application.

Step 2 - Configure your Dependencies

  • In Tools > NuGet Package Manager > Manage NuGet Packages for Solution…, browse the ATK Package source in which widgets are displayed.
  • Select MyScript.Atk.MathWidget and click Install.
For more information on NuGet packages, see the corresponding documentation.

Step 3 - Add Resources

Copy the Resources directory from Samples\MathWidgetSample\MathWidgetSample into your project.

Then, edit their properties:

  • Build Action: Content
  • Copy to Output Directory: Copy always
Resources are available for download on the Developer Portal. You can also customize your own resources: Check the Developer Tools page to discover how.

Step 4 - Start with Minimal Integration Code

An Internet connection is required to launch and run ATK applications. To authorize it, check the Internet (Client) box in the Capabilities tab of the Package.appxmanifest.xml file.

However, a 30-day grace period is offered, from the moment you first launch your application. A connection will then be mandatory.

Edit the MainPage.xaml file:

<Page

    xmlns:math="using:MyScript.Atk.MathWidget"
>

    <math:MathWidget x:Name="MathWidget" Grid.Row="1" Background="White"/>

Edit the MainPage.xaml.cs file:

using System;
using System.Diagnostics;
using Windows.UI.Popups;
using Windows.UI.Xaml.Controls;

using MyScript.Certificate;
using MyScript.Atk.MathWidget;

namespace MathDemo
{
  public sealed partial class MainPage : Page
  {
    public MainPage()
    {
      InitializeComponent();

      if (!MathWidget.RegisterCertificate((byte[])(Array)MyCertificate.Bytes))
      {
        ShowCertificateError();
        return;
      }

      MathWidget.ConfigurationEndHandler += OnConfigurationEnd;
      MathWidget.ConfigurationFailedHandler += OnConfigurationError;

      MathWidget.RecognitionEndHandler += OnRecognitionEnd;

      // References resources copied as Content
      var resourcesDir = System.IO.Path.Combine(Windows.ApplicationModel.Package.Current.InstalledLocation.Path, "Resources", "conf");
      MathWidget.AddSearchDir(resourcesDir);

      // The configuration is an asynchronous operation. Callbacks are provided to
      // monitor the beginning and end of the configuration process.
      //
      // "math" references the math bundle name in conf/math.conf file in your resources.
      // "standard" references the configuration name in math.conf
      MathWidget.Configure("math", "standard");
    }

    private async void ShowCertificateError()
    {
      var dialog = new MessageDialog("Please use a valid certificate.", "Invalid Certificate");
      await dialog.ShowAsync();
    }

    private void OnConfigurationEnd(object sender, Object obj)
    {
      Debug.WriteLine("Math Widget Configured!");
    }

    private void OnConfigurationError(object sender, string error)
    {
      Debug.WriteLine("Math Widget configuration error: {0}", error);
      throw new Exception();
    }

    private void OnRecognitionEnd(object sender, Object obj)
    {
      Debug.WriteLine("Math Widget recognition: {0}", MathWidget.ResultAsText());
    }
  }
}

API

See the API documentation for Windows.