网页摇杆——使用HTML5的canvas实现
说明
- 之前有用过安卓做wifi小车的控制器,但是安卓的开发的程序只能在安卓上面运行。加上对html5应用技术很感兴趣,毕竟一次写好,安卓ios、pc都可以使用,这本身的诱惑力还是挺大的。所以尝试用html5实现一个摇杆joystick
- 手机宽度自适应没有做……而且手机上使用因为浏览器会滑动所以效果很差,这个不知道有没有办法解决
- websocket发送摇杆值那个去掉了,加上也很容易
代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>摇杆</title>
</head>
<body>
<canvas id="canvas" width="600" height="600" style="border: 1px solid #888"></canvas>
<form action="#">
<input id='url' type="text" value="ws://localhost:8008">
<input id='connect' type="button" value="连接">
<input id='disconnect' type="button" value="断开">
<sapn id="xva