1 | <!DOCTYPE html>
|
2 | <html lang="en">
|
3 | <head>
|
4 | <meta charset="utf-8">
|
5 | <title>math.js | angle configuration</title>
|
6 | <style>
|
7 | body, input, select {
|
8 | font: 11pt sans-serif;
|
9 | }
|
10 | input, select, th, #result {
|
11 | padding: 5px 10px;
|
12 | }
|
13 | th {
|
14 | text-align: left;
|
15 | }
|
16 | </style>
|
17 |
|
18 | <script src="../../lib/browser/math.js"></script>
|
19 | </head>
|
20 | <body>
|
21 |
|
22 | <p>
|
23 | This code example extends the trigonometric functions of math.js with configurable angles: degrees, radians, or gradians.
|
24 | </p>
|
25 |
|
26 | <table>
|
27 | <tr>
|
28 | <th>Angles</th>
|
29 | <td>
|
30 | <select id="angles">
|
31 | <option value="deg">deg</option>
|
32 | <option value="grad">grad</option>
|
33 | <option value="rad">rad</option>
|
34 | </select>
|
35 | </td>
|
36 | </tr>
|
37 | <tr>
|
38 | <th>Expression</th>
|
39 | <td>
|
40 | <input id="expression" type="text" value="sin(45)" />
|
41 | <input id="evaluate" type="button" value="Evaluate">
|
42 | </td>
|
43 | </tr>
|
44 | <tr>
|
45 | <th>Result</th>
|
46 | <td id="result"></td>
|
47 | </tr>
|
48 | </table>
|
49 |
|
50 | <script>
|
51 | let replacements = {}
|
52 |
|
53 |
|
54 | const config = {
|
55 | angles: 'deg'
|
56 | }
|
57 |
|
58 |
|
59 | const fns1 = ['sin', 'cos', 'tan', 'sec', 'cot', 'csc']
|
60 | fns1.forEach(function(name) {
|
61 | const fn = math[name]
|
62 |
|
63 | const fnNumber = function (x) {
|
64 |
|
65 | switch (config.angles) {
|
66 | case 'deg':
|
67 | return fn(x / 360 * 2 * Math.PI)
|
68 | case 'grad':
|
69 | return fn(x / 400 * 2 * Math.PI)
|
70 | default:
|
71 | return fn(x)
|
72 | }
|
73 | }
|
74 |
|
75 |
|
76 | replacements[name] = math.typed(name, {
|
77 | 'number': fnNumber,
|
78 | 'Array | Matrix': function (x) {
|
79 | return math.map(x, fnNumber)
|
80 | }
|
81 | })
|
82 | })
|
83 |
|
84 |
|
85 | const fns2 = ['asin', 'acos', 'atan', 'atan2', 'acot', 'acsc', 'asec']
|
86 | fns2.forEach(function(name) {
|
87 | const fn = math[name]
|
88 |
|
89 | const fnNumber = function (x) {
|
90 | const result = fn(x)
|
91 |
|
92 | if (typeof result === 'number') {
|
93 |
|
94 | switch(config.angles) {
|
95 | case 'deg': return result / 2 / Math.PI * 360
|
96 | case 'grad': return result / 2 / Math.PI * 400
|
97 | default: return result
|
98 | }
|
99 | }
|
100 |
|
101 | return result
|
102 | }
|
103 |
|
104 |
|
105 | replacements[name] = math.typed(name, {
|
106 | 'number': fnNumber,
|
107 | 'Array | Matrix': function (x) {
|
108 | return math.map(x, fnNumber)
|
109 | }
|
110 | })
|
111 | })
|
112 |
|
113 |
|
114 | math.import(replacements, {override: true})
|
115 |
|
116 |
|
117 | const expression = document.getElementById('expression')
|
118 | const evaluate = document.getElementById('evaluate')
|
119 | const result = document.getElementById('result')
|
120 | const angles = document.getElementById('angles')
|
121 |
|
122 |
|
123 | angles.onchange = function () {
|
124 | config.angles = this.value
|
125 | config.angles = this.value
|
126 | }
|
127 | evaluate.onclick = function () {
|
128 | result.innerHTML = math.evaluate(expression.value)
|
129 | }
|
130 | </script>
|
131 |
|
132 |
|
133 | </body>
|
134 | </html> |
\ | No newline at end of file |