ワードプレス上でjavascriptとhtmlを使って計算をやらせる

 

前回の投稿ではhtmlで色々計算させようと思ったのだけど、htmlだけだと色々やるのはちょっと難しそうな雰囲気。

内部リンク: ショートコードでhtmlコード利用・練習編〜四則演算導入〜

そういうわけで、今回の投稿ではjavascriptとhtmlを組み合わせて、ワードプレス上でちょっとだけ複雑な計算をやらせることを目標としたい。

ショートコードでjavascript自体が普通に動くのは確認済み。

内部リンク: htmlとjavascriptでユーザーインプットに対して文字列を返す

なので、後はjavascriptでちょっと複雑な計算を走らせる方法を調べれば良いだけだな。

ワードプレス上でjavascriptにちょっと複雑な計算をやってもらう

ってわけでJavascriptは何があるのかなーってみてたら、Mathオブジェクトでだいたい揃ってる。

うん、やりたいことやるのにこれだけで問題なさそうだな。

おお、つまりjavascript動かすテンプレ準備しちゃえば、そこそこの計算させるウェブツール作ってくのは結構楽なんだな。

ってかあっさり解決しすぎちゃってこの投稿書くことがまったく無いなー。

sinはMath.sinで計算できるよ!

なんて書いてもなあ……ああ、radiansが組み込まれてないらしいので(Math.PI/180)かける必要があるよ!

んー、いまいち。

あー、有効数字の関係かsin360度が0にならないな。そんなときは計算したところで.toFixedで出力桁数調整して解決!

さて、少し文字数も増えたしこんなもんでいっか……とりあえず下の実行例は角度を突っ込んで、角度1のサインと角度2のコサインを足し算して出力するもの。

コードのスクショ:

sinとcosの足し算

あ、日本語、ていうか全角だとバグるなこれ。英語になおしまーす。

実行例:

 

sin-angle (degree):

cos-angle (degree):

calculate sin(A)+cos(B)

 

よーっし、後は作りたかったwebツールを別投稿でつくろう!

関連記事

1. ウェブサイト制作系お勉強のまとめ

D

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください