Plotter Object တစ်ခု
Artificial Intelligence ကိုလေ့လာတဲ့အခါ Plotter Object ရှိတာက ကောင်းပါတယ် ။
- AI ကို ပို ပျော်စေတယ် ။
- AI ကို Visual ပိုဖြစ်စေတယ်။
- AI ကို ပို နားလည်နိုင်စေတယ် ။
Plotter Object ဖန်တီးပါ။
ဥပမာ
function XYPlotter(id) {
this.canvas = document.getElementById(id);
this.ctx = this.canvas.getContext("2d");
this.xMin = 0;
this.yMin = 0;
this.xMax = this.canvas.width;
this.yMax = this.canvas.height;
.
.
မျဉ်းဆွဲခြင်းအတွက် နည်းလမ်းတစ်ခုထည့်ပါ။
ဥပမာ
this.plotLine = function(x0, y0, x, y, color) {
this.ctx.moveTo(x0, y0);
this.ctx.lineTo(x, y);
this.ctx.strokeStyle = color;
this.ctx.stroke();
}
XY တန်ဖိုးများကို ပြောင်းလဲရန်အတွက် နည်းလမ်းတစ်ခု ထည့်ပါ။
ဥပမာ
this.transformXY = function() {
this.ctx.transform(1, 0, 0, -1, 0, this.canvas.height)
}
Plotting Points အတွက် နည်းလမ်းတစ်ခု ထည့်ပါ။
ဥပမာ
this.plotPoints = function(n, xArr, yArr, color, radius = 3) {
for (let i = 0; i < n; i++) {
this.ctx.fillStyle = color;
this.ctx.beginPath();
this.ctx.ellipse(xArr[i], yArr[i], radius, radius, 0, 0, Math.PI * 2);
this.ctx.fill();
}
}
ကျပန်းအမှတ်အချို့ကို ကြံစည်ပါ။
ဥပမာ
// Create a Plotter
let myPlotter = new XYPlotter("myCanvas");
// Create random XY Points
numPoints = 500;
const xPoints = Array(numPoints).fill(0).map(function(){return Math.random() * myPlotter.xMax});
const yPoints = Array(numPoints).fill(0).map(function(){return Math.random() * myPlotter.yMax});
// Plot the Points
myPlotter.plotPoints(numPoints, xPoints, yPoints, "blue");
Code ကို Library တွင်ထည့်ပါ။
အရင်းအမြစ်ကုဒ်
function XYPlotter(id) {
this.canvas = document.getElementById(id);
this.ctx = this.canvas.getContext("2d");
this.xMin = 0;
this.yMin = 0;
this.xMax = this.canvas.width;
this.yMax = this.canvas.height;
// Plot Line Function
this.plotLine = function(x0, y0, x, y, color) {
this.ctx.moveTo(x0, y0);
this.ctx.lineTo(x, y);
this.ctx.strokeStyle = color;
this.ctx.stroke();
}
// Transform XY Function
this.transformXY = function() {
this.ctx.transform(1, 0, 0, -1, 0, this.canvas.height)
}
// Pot Points Function
this.plotPoints = function(n, xArr, yArr, color, radius = 3) {
for (let i = 0; i < n; i++) {
this.ctx.fillStyle = color;
this.ctx.beginPath();
this.ctx.ellipse(xArr[i], yArr[i], radius, radius, 0, 0, Math.PI * 2);
this.ctx.fill();
}
}
} // End Plotter Object
၎င်းကို ဖိုင်ထဲတွင် သိမ်းဆည်းပါ ("myplotlib.js" ကဲ့သို့)
၎င်းကို သင်၏ HTML စာမျက်နှာများတွင် အသုံးပြုပါ။
ယခု သင်သည် သင်၏ plotter object ကို သင်၏ HTML စာမျက်နှာများတွင် ထည့်နိုင်သည်-
ဥပမာ
<script src="myplotlib.js"></script>