帶座標的三角形？

Question

如何使用HTML5像in this applet那樣構建座標爲三角形的座標？這甚至有可能嗎？

任何指導都會很棒。

Answer 1

您將需要HTML5的畫布元素和JavaScript。這應該是訣竅：

<canvas id="canvasId" width="165px" height="145px"></canvas> 

<script type="text/javascript"><!-- 
    window.addEventListener('load', function() { 

     var context = document.getElementById("canvasId").getContext("2d"); 

     var width = 125; // Triangle Width 
     var height = 105; // Triangle Height 
     var padding = 20; 

     // Draw a path 
     context.beginPath(); 
     context.moveTo(padding + width/2, padding);  // Top Corner 
     context.lineTo(padding + width, height + padding); // Bottom Right 
     context.lineTo(padding, height + padding);   // Bottom Left 
     context.closePath(); 

     // Fill the path 
     context.fillStyle = "#ffc821"; 
     context.fill(); 

    }, false); 
// --></script>