那些遇到过的问题

相关疑难解决方法(0)

在画布HTML5的中心写入(0,0)

我目前正在开发一个绘图应用程序,允许用户单击并拖动以确定形状的大小,并且还能够使用绘制的形状进行转换.这是我到现在为止的截图: 在此输入图像描述

我将轴定位在画布的中心,但现在我想在中心写(0,0).正如你所看到的,我写的CSS只会让它出现在顶部,但我希望它在中心.这是我的transformation.html代码:

    <!DOCTYPE html>
    <head>
         <title>Drawing Application</title>
         <link href="transform.css" rel="stylesheet">

    </head>

    <body>

    <canvas id="myCanvas" width="1000" height="500"></canvas>
    <span style="margin-left:820px; margin-top:500px;">(0,0)</span> <!--tried with some CSS-->
    <br><output id="out"></output>
    <script src="transform.js"></script>
    <div id="shapeProperties">
    <p>
    <label>
    <div id="shape">
    <p><b>Fill shapes option:</b> <input type="checkbox" id="fillType"></b><br/>
    <p><b><center><u>Shapes</u></center></b>&nbsp; &nbsp;

    <p>Polygon&nbsp;<input type="checkbox" id="polyBox"><br/>

    </div>

    <div id="color">
    <b><p><center><u>Color Properties</u></center></b><br/>
    <p>Fill Color&nbsp;<input type="color" id="fillColor" value="#000000"/><br/>
    <p>Stroke Color&nbsp; <input type="color" id="strokeColor" value="#000000"/><br/>
    </div>
    <div id="range">
    <b><p><center><u>Other Properties</u></center></b><br/>
    <label>Polygon Sides&nbsp; <input type="range" id="polygonSide" step="1" min="3" max="9" value="3"></label>
    </div>
    <div id="clear">
    <p> <center><input id="clearCanvas" …
Run Code Online (Sandbox Code Playgroud)

javascript css html5 canvas

Man*_*noo
lucky-day
1
推荐指数
1
解决办法
1940
查看次数

标签 统计

canvas ×1

css ×1

html5 ×1

javascript ×1