react-native-math-view

WIP V3

A react native view used to easily display and handle math.

Launch Test	Example App

Installation

npm install --save react-native-math-view OR yarn add react-native-math-view

react-native > 0.59

iOS:

Install react-native-svg

$ cd ios && pod install

Errors during installation:

If you're getting an error regarging compileMathjax you can disregard it as long as compiled mathjax successfully was printed to the console. If you're using yarn it's probable no logging will show.
To be sure everything is compiled properly run the following command from the mathjax-full node_module directory of your project:

npm run compile

typescript errors can be safely disregareded.
see also #16

Getting Started

import MathView from 'react-native-math-view';

  return (
    ...
    	<MathView
	   math={'x=\\frac{-b\\pm\\sqrt{b^2-4ac}}{2a}'}
	/> 
	<MathView
	   math='\cos\left(x\right)=\frac{b}{c}'
	/> 
    ...
  );

TroubleShooting

1. Make sure to properly escape all LaTeX strings (Syntax sensitive):

This occurs because when passing math={value}, value gets evaluated as opposed to math='LaTeX'.
It is cosidered best practice to avoid using math='LaTeX'.

        <MathView
-	   math='x=\\frac{-b\\pm\\sqrt{b^2-4ac}}{2a}'
+	   math='x=\frac{-b\pm\sqrt{b^2-4ac}}{2a}'
	/> 
	
	//	OR
	
        <MathView
-	   math={'x=\frac{-b\pm\sqrt{b^2-4ac}}{2a}'}
+	   math={'x=\\frac{-b\\pm\\sqrt{b^2-4ac}}{2a}'}
	/> 

Running example app

From the project's directory run:

yarn --production=false
cd MathExample
yarn --production=false
npm run android

Developing:

From root run:

npm run dev

This will watch ts files and start bundler.

Implementation:

• iOS native MathView - POC successful, need to implement native measuring. For now fallbacking to react-native-svg

• Android MathView - native since V2, based on Android SVGImageView. Need to implement editable state.

FollowUp

iOS editable math view

KaTeX - Math keypad that works with <WebView>. See this

React with LaTeX - using server side rendering to speed things up.

Writing math dynamically