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