गेम मोशन

गेम घुमाने अध्याय में वर्णित नए तरीके से कंपोनेंट बनाने का उपयोग करके, अब अभियान अधिक लचीला है।


क्या वस्तु कैसे चलती है? फिर से खेलें

component के निर्माण में एक गुण, जो कंपोनेंट के वर्तमान गति का प्रतिनिधित्व करता है, speed speed

तरीके में newPos() कुछ बदलाव करें, ताकि speed तरीके में angle कंपोनेंट के स्थान की गणना करने के लिए

मूलभूत रूप से, कंपोनेंट ऊपर की ओर देखता है, और इसे speed गुण को 1 सेट करें, ताकि कंपोनेंट आगे बढ़ना शुरू करे।

इंस्टांस

function component(width, height, color, x, y) {
  this.gamearea = gamearea;
  this.width = width;
  this.height = height;
  this.angle = 0;
  this.speed = 1;
  this.x = x;
  this.y = y;
  this.update = function() {
    ctx = myGameArea.context;
    ctx.save();
    ctx.translate(this.x, this.y);
    ctx.rotate(this.angle);
    ctx.fillStyle = color;
    ctx.fillRect(this.width / -2, this.height / -2, this.width, this.height);
    ctx.restore();
  }
  this.newPos = function() {
    this.x += this.speed * Math.sin(this.angle);
    this.y -= this.speed * Math.cos(this.angle);
  }
}

स्वयं आयात कीजिए

घूमना

हम अब बाईं ओर दाईं ओर घूमना भी चाहते हैं। एक नाम के लिए बनाएं moveAngle के नए गुण, जो वर्तमान स्थानांतरण या घूमाने का निर्देशक देता है। इसके newPos() तरीके में नए moveAngle गुण गणना angle:

इंस्टांस

कृपया moveangle गुण को 1 सेट करें, जिससे जानें कि क्या होगा:

function component(width, height, color, x, y) {
  this.width = width;
  this.height = height;
  this.angle = 0;
  this.moveAngle = 1;
  this.speed = 1;
  this.x = x;
  this.y = y;
  this.update = function() {
    ctx = myGameArea.context;
    ctx.save();
    ctx.translate(this.x, this.y);
    ctx.rotate(this.angle);
    ctx.fillStyle = color;
    ctx.fillRect(this.width / -2, this.height / -2, this.width, this.height);
    ctx.restore();
  }
  this.newPos = function() {
    this.angle += this.moveAngle * Math.PI / 180;
    this.x += this.speed * Math.sin(this.angle);
    this.y -= this.speed * Math.cos(this.angle);
  }
}

स्वयं आयात कीजिए

क्या कैसे इस्तेमाल करें

कि क्या लाल बॉक्स कैसे चलता है? जब आप 'ऊपर' निर्देशक अर्थ का प्रयोग करते हैं, लाल बॉक्स ऊपर और नीचे नहीं चलता है, वहीं से एक तरफ से दूसरी तरफ बढ़ता है और जब आप बाईं और दाईं तरफ के निर्देशक का प्रयोग करते हैं तो वह बाईं और दाईं ओर घूमता है।

इंस्टांस

स्वयं आयात कीजिए

गेम क्षेत्र को फोकस करें, फिर नेविगेशन की आइकन का उपयोग करके लाल बॉक्स को खिसकाएं।