今回はmath.jsを使うとはいうものの複素数の計算だけ(実部虚部に分けてもよかったけどせっかくなので)。
ソースコードはこちら。
結果はこちら。
テキストでも書いておきます。
<canvas class="canvasmandel" width="360" height="360" style = "background-color :black;"></canvas><br>
<label for "Cxmax">Cxmax</label>
<input type="text" value="1" id="Cxmax">
<label for "Cxmin">Cxmin</label>
<input type="text" value="-2.5" id="Cxmin"><br>
<label for "Cymax">Cymax</label>
<input type="text" value="1.75" id="Cymax">
<label for "Cymin">Cymin</label>
<input type="text" value="-1.75" id="Cymin"><br>
<button class ="ButtonMandel">計算</button>
<script src="https://unpkg.com/mathjs@11.4.0/lib/browser/math.js"></script>
<script>
'use strict'
const canvasmandel = document.querySelector('.canvasmandel')
const ctx = canvasmandel.getContext('2d')
const CxmaxInput = document.querySelector('#Cxmax')
const CxminInput = document.querySelector('#Cxmin')
const CymaxInput = document.querySelector('#Cymax')
const CyminInput = document.querySelector('#Cymin')
const ButtonMandel = document.querySelector('.ButtonMandel')
ButtonMandel.addEventListener('click', MandelCalc)
function MandelCalc() {
const Cxmax = parseFloat(CxmaxInput.value)
const Cxmin = parseFloat(CxminInput.value)
const Cymax = parseFloat(CymaxInput.value)
const Cymin = parseFloat(CyminInput.value)
const kmax = 200
const width = canvasmandel.width
const height = canvasmandel.height
ctx.clearRect(0, 0, width, height)
for (let i = 0; i <= width; i++) {
for (let j = 0; j <= height; j++) {
let C = math.complex(Cxmin + (Cxmax - Cxmin)*i/width, Cymin + (Cymax - Cymin)*j/height)
let z = math.complex(0, 0)
for (let k = 0; k < kmax; k++) {
z = math.add(math.square(z),C)
if (math.abs(z) > 4) {
const Xr = width * (math.re(C) - Cxmin)/(Cxmax - Cxmin)
const Yr = height * (math.im(C) - Cymax)/(Cymin - Cymax)
ctx.fillStyle = 'hsl(' + Math.floor(360 * Math.log10(k)/Math.log10(kmax)) + ',100%,50%)'
ctx.fillRect(Xr, Yr, 1, 1)
break
}
}
}
}
}
</script>
このココログでも表示できるようにしてみた。こちら。
Cxmax
Cxmin
Cymax
Cymin
計算
過去のもの
JavaScriptの数値計算ライブラリmathjsを使う(1) まずは行列演算。LU分解で一次方程式を解き、逆行列と行列式を求める。このココログで直接計算できる機能も付けた。
JavaScriptの数値計算ライブラリmathjsを使う(2) 次は複素数演算。四則演算や平方根、べき乗、expなどが簡単にできる。このココログで直接計算できる簡易電卓を作ってみた。
JavaScriptの数値計算ライブラリmathjsを使う(3) Plotlyを併用して関数をグラフ表示する。ココログでもグラフ表示できるようになった。
JavaScriptの数値計算ライブラリmathjsを使う(4) 高速フーリエ変換(FFT)を計算してココログにplotlyでグラフ表示できるようにする。。
JavaScriptの数値計算ライブラリmathjsを使う(5) 複素行列の固有値・固有ベクトルを求める。ココログで計算できるようにした。
JavaScriptの数値計算ライブラリmathjsを使う(6) 特異値分解(SVD)、主成分分析(PCA)を計算してみる。このココログでも計算できるようにした。
最近のコメント