謝宸峰JavaScript物件canvas繪製選擇權到期日損益

複製甲班示範

identifier名稱，身分證id card

<p class="a" id="xyz"></p>

<p class="b" id="dog"></p>

<p class="a" id="cat"></p>

<script>

// Create an object:

const band = {

guitar:"侯麗鷗", 

vocals:"蔡依雯",

bass:"林志玲"};

delete band.vocals;

band["singer"] = "劉任昌";

s=""; //定義變數空白

document.getElementById("xyz").innerHTML = Object.keys(band);

document.getElementById("dog").innerHTML = Object.values(band);

for (job in band){ 

   s+= job + "手: " + band[job] + "<br>"};

document.getElementById("cat").innerHTML = s;

</script>

明星w3schools學物件

<style>

.a{background-image: linear-gradient(red, yellow); font-size: 32px; line-height:1.5}

.b{background-image: linear-gradient(red, blue); color: white; font-size:30px}

</style>

identifier名稱，身分證id card

<p id="xyz" class="a"></p>

<p id="dog" class="b"></p>

<p id="cat" class="a"></p>

<script>

// Create an object:

const band = {

guitar:"王一博", 

vocals:"王鶴棣",

bass:"迪麗熱巴"};

//delete band.vocals;

band["singer"] = "謝宸峰";

band["singer"] = "金晨";

s=""; //定義變數空白

document.getElementById("xyz").innerHTML = Object.keys(band);

document.getElementById("dog").innerHTML = Object.values(band);

for (job in band){ 

   s+= job + "手: " + band[job] + "<br>"};

document.getElementById("cat").innerHTML = s;

</script>

心得

delete物件的.屬性;增加物件band["singer"]=....

canvas繪圖套件繪製選擇權到期日損益圖

canvas繪圖套件繪製選擇權到期日損益圖 原始碼

<h1>canvas繪圖套件繪製選擇權到期日損益圖</h1>

<canvas id="BuyOptions" width="500" height="300"></canvas>

<script>

const c = document.getElementById("BuyOptions");

const ctx = c.getContext("2d");

ctx.beginPath();

ctx.moveTo(0, 0);

ctx.lineTo(100, 100);

ctx.lineTo(200,100);

ctx.font = "16px Arial";

ctx.fillText("買入賣權puts的到期日損益",0,120);

ctx.moveTo(300, 100);

ctx.lineTo(400, 100);

ctx.lineTo(500, 0);

ctx.fillText("買入買權callss的到期日損益",300,120);

ctx.moveTo(0, 300);

ctx.lineTo(100, 200);

ctx.lineTo(200,200);

ctx.font ="30pt";

ctx.fillText("賣出賣權puts的到期日損益",0,180);

ctx.moveTo(300, 200);

ctx.lineTo(400, 200);

ctx.lineTo(500, 300);

ctx.fillText("賣出買權callss的到期日損益",300,180)

ctx.stroke();//繪製

</script>