zoukankan      html  css  js  c++  java
  • canvas 绘制跟随鼠标移动的线条

    坦克大作战游戏中常见,点击某点,坦克的枪口会自动对准被点击的点!
    window.onload = function() {
            var canvas = document.getElementById("canvas");
            var obj = canvas.getContext('2d');
        
            obj.moveTo( 300, 500);
            obj.lineTo( 300, 480);
            obj.lineWidth = 6;
            obj.strokeStyle = "#ff0000";
            obj.stroke();
            
            canvas.onmousedown = function( e ){
                var mx = e.layerX;
                var my = e.layerY;
                
                var sx = 300;
                var sy = 500;
                
                var angle = Math.atan2( ( my - sy), ( mx - sx ) )
                
                obj.clearRect(0, 0, 600, 600);
                obj.beginPath();
                obj.moveTo( sx, sy );
                obj.lineTo( sx + 20 * Math.cos( angle ), sy + 20 * Math.sin(angle));
                obj.stroke();
            };
        };
    

      

  • 相关阅读:
    mybatis-generator的坑
    log框架集成
    状压dp
    GYM 101350 G
    Wannafly挑战赛23 A 字符串
    基础
    ACM Changchun 2015 A. Too Rich
    最大子串和
    memset
    int long long 的范围
  • 原文地址:https://www.cnblogs.com/yuguilin/p/5751045.html
Copyright © 2011-2022 走看看