Question

如何使用像in this applet这样的HTML5构建带坐标的三角形？这甚至可能吗？

任何指导都会很棒。

Answer 1

您将需要HTML5的canvas元素以及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>

带坐标的三角形？

1 个答案: