AI in The Browser
Artificial Intelligence in the browser means:
- AI with JavaScript
- Machine Learning (ML) with JavaScript
- Deep Learning (DL) with JavaScript
- AI for Everyone on the Web
- AI on more Platforms
- AI for a wider Audience
Math in the Browser
Math.js is an extensive math library for JavaScript and Node.js.
Math.js is powerful and easy to use. It comes with a large set of built-in functions, a flexible expression parser, and solutions to work with many data types like numbers, big numbers, complex numbers, fractions, units, arrays, and matrices.
Machine Learning in the Browser
Brain.js is a GPU accelerated neural networks in JavaScript for Browsers and Node.js.
Brain.js is simple to use. You do not need to know neural networks in details to work with Brain.js.
Brain.js provides multiple neural network implementations as different neural nets can be trained to do different things well.
Plotting in the Browser
Here is a list of some JavaScript libraries to use for both Artificial Intelligence graphs and other charts:
Plotting Equations
Enter Equation:
sin(x) * 2 + 17
<!DOCTYPE html>
<html>
<body>
<p>Enter Equation:</p>
<p><input id=”equation” type=”text” value=”x * 2 + 17″></p>
<p>
<button onclick=’plot(“scatter”)’>Scatter</button>
<button onclick=’plot(“lines”)’>Draw Lines</button>
</p>
<div id=”myPlot” style=”width:100%;max-width:700px”></div>
<script>
function plot(type) {
var exp = document.getElementById(“equation”).value;
var xValues = [];
var yValues = [];
// Generate values
for (var x = 0; x <= 10; x += 1) {
xValues.push(x);
yValues.push(eval(exp));
}
// Display using Plotly
var mode = “lines”;
if (type == “scatter”) {mode = “markers”}
var data = [{x:xValues, y:yValues, mode:mode, type:”scatter”}];
var layout = {title: “y = ” + exp};
Plotly.newPlot(“myPlot”, data, layout);
}
</script>
</body>
</html>
Plotting Values
Enter X and Y Values:
50,60,70,80,90,100,110,120,130,140,150
7,8,8,9,9,9,10,11,14,14,15
<!DOCTYPE html>
<html>
<body>
<p>
<label>Enter X and Y Values:</label>
<p>X values:<br>
<input id=”xvalues” style=”width:95%” type=”text”
value=”50,60,70,80,90,100,110,120,130,140,150″></p>
<p>Y values:<br>
<input id=”yvalues” style=”width:95%” type=”text”
value=”7,8,8,9,9,9,10,11,14,14,15″></p>
<button onclick=’plot(“scatter”)’>Scatter</button>
<button onclick=’plot(“lines”)’>Draw Lines</button>
<div id=”myPlot” style=”width:100%;max-width:700px”></div>
<script>
function plot(type) {
var xArray = document.getElementById(“xvalues”).value.split(‘,’);
var yArray = document.getElementById(“yvalues”).value.split(‘,’);
var mode = “lines”;
if (type == “scatter”) {mode = “markers”}
Plotly.newPlot(“myPlot”, [{x:xArray, y:yArray, mode:mode, type:”scatter”}]);
}
</script>
</body>
</html>
Web2goTech 