cari

Rumah  >  Soal Jawab  >  teks badan

javascript - Apakah idea untuk melaksanakan kereta bergerak JS?

Idea peribadi saya adalah untuk mendapatkan koordinat tetikus dan koordinat kereta apabila mengklik, hitung sudut tan antara garis lurus yang dibentuk oleh dua titik ini dan paksi X, dan gunakan setInterval() untuk meningkatkan X- arah paksi kereta sebanyak 1px dan paksi-Y setiap milisaat (1*tan)px;
Tetapi terdapat masalah dengan pelaksanaan kod, dan nilai tan yang dikira terus berubah.
Saya sangat keliru. Saya tidak tahu sama ada ia masalah dengan pemikiran saya atau masalah dengan kod saya memohon semua pakar untuk membantu saya memikirkannya. Saya harap ada kod rujukan yang sepadan. Saya telah mencarinya di Google tetapi tidak dapat mencari penyelesaian. Pengajar meminta saya menyerahkannya pada pagi esok, saya benar-benar tidak tahu apa yang perlu dilakukan dengannya)

$(document).ready(function() {
    // 获取鼠标坐标
    $(document).mousemove(function(e) {
        mouse.X = e.clientX;
        mouse.Y = e.clientY;
    });
    $(document).click(function() {
        // 获取点击时鼠标垫的位置
        var mX = mouse.X;
        var mY = mouse.Y;
        // 获取飞机之前的位置
        var airX = $("#air").css("left");
        var airY = $("#air").css("top");
        // 处理字符串中的px并转换为数字
        airX = airX.substring(0, airX.length - 2);
        airY = airY.substring(0, airY.length - 2);
        airX = Number(airX);
        airY = Number(airY);
        // 计算飞机与鼠标连线与X轴构成的夹角
        var tan = (mX - airX) / (mY - airY);
        console.log(tan)
        setInterval(function() {
            main(mX, mY,tan);
        }, 1)
    })
});

// 创建鼠标对象
var mouse = {
    X: 0,
    Y: 0
}

function main(mX, mY,tan) {

    // 计算每毫秒小飞机前进的距离
    // 设定X轴前进1px,Y轴前进1*tan px
    var mX = mX + 1;
    var mY = mY + tan;
    ff(mX + "px", mY + "px");
}

function ff(X, Y) {
    $("#air").css({ "top": X });
    $("#air").css({ "left": Y });
}
仅有的幸福仅有的幸福2848 hari yang lalu703

membalas semua(4)saya akan balas

  • phpcn_u1582

    phpcn_u15822017-05-19 10:19:49

    Soalan

    Idea peribadi saya adalah untuk mendapatkan koordinat tetikus dan koordinat kereta apabila mengklik, hitung sudut tan antara garis lurus yang dibentuk oleh dua titik ini dan paksi X, dan gunakan setInterval() untuk meningkatkan X -arah paksi kereta sebanyak 1px dan paksi-Y setiap milisaat Tambah (1*tan)px;
    Tetapi terdapat masalah dengan pelaksanaan kod, dan nilai tan yang dikira terus berubah.
    Saya sangat keliru. Saya tidak tahu sama ada ia masalah dengan pemikiran saya atau masalah dengan kod saya memohon semua pakar untuk membantu saya memikirkannya. Saya harap ada kod rujukan yang sepadan. Saya mencarinya di Google, tetapi saya tidak dapat mencari penyelesaian. Pengajar meminta saya menyerahkan Kod pagi esok, saya benar-benar tidak tahu apa yang perlu dilakukan dengannya)

    Kod boleh guna

    $(document).ready(function() {
        var timer; 
        // 在点击的时候获取鼠标坐标
        $(document).click(function(event) {
            // 获取点击时鼠标垫的位置
            var mX = event.clientX; 
            var mY = event.clientY; 
            // 获取飞机之前的位置
            console.log(event); 
            var airX = $("#air").css("left");
            var airY = $("#air").css("top");
            // 处理字符串中的px并转换为数字 可以简化成 
            airX = parseFloat(airX); 
            airY = parseFloat(airY); 
            
            
            var Xi = (mX - airX) / 50; 
            var Yi = (mY - airY) / 50; 
    
            clearInterval(timer); // 把上次的清掉 
            timer = setInterval(function() { 
                renderInc(Xi, Yi);
            }, 16) // 16 
        })
    });
    
    // 增量渲染 
    function renderInc(Xi, Yi) {
        $air = $("#air"); 
        var x = parseFloat($air.css('left'))
        var y = parseFloat($air.css('top'))
    
        $("#air").css({
            top: y + Yi + 'px', 
            left: x + Xi + 'px'
        });
    }
    

    balas
    0

  • phpcn_u1582

    phpcn_u15822017-05-19 10:19:49

    Letakkan kereta dahulu, kemudian dapatkan kedudukan clienX di bawah titik tetikus, gunakan clientX ini untuk menolak $('#car')offset().kiri kereta, tentukan arah berdasarkan nilai positif dan negatif, tentukan jarak berdasarkan nilai mutlak, dan kemudian ubah suai Hanya sebelah kiri kereta akan lakukan

    balas
    0
  • phpcn_u1582

    phpcn_u15822017-05-19 10:19:49

    Tidak perlu menggunakan formula mewah sedemikian Untuk gerakan seragam, darabkan kelajuan dengan masa untuk mendapatkan jarak setiap pergerakan
    Semasa x, y
    Sasaran x', y'
    Kelajuan v
    Masa untuk menyasarkan t=. (x'- x)/v
    selang masa selang dT
    kedudukan seterusnya x" = x + dT*v, y"=..
    Hanya alihkan kedudukan ke x", y" dalam selang

    balas
    0
  • 我想大声告诉你

    我想大声告诉你2017-05-19 10:19:49

    Logiknya nampak okay, tetapi jika anda ingin mengira tan sudut antara arah dan paksi X, ia sepatutnya

    var tan = (mY - airY) / (mX - airX);

    Betul, anda menulisnya ke belakang...

    balas
    0
  • Batalbalas