Как я могу исправить случайное колебание спрайта, который движется по направлению к мыши, при использовании camera.position в качестве спрайта в качестве центра? - PullRequest
0 голосов
/ 10 марта 2020

Итак, когда я использую

camera.position.x = player.x; 
camera.position.y = player.y;

для установки центра камеры на мой спрайт, код не работает так, как задумано. Это немного сложно объяснить, поэтому я сделал это видео (https://youtu.be/afCamx_wB_4), в котором я показываю, как оно должно работать, и разницу / проблему при использовании camera.position

Также, как вы можете видите, спрайт начинает вибрировать, когда достигает указателя мыши, даже если не используется camera.position, что является еще одной ошибкой. Если возможно, расскажите, пожалуйста, как это исправить. Код, связанный с этим:

function setup() {
  createCanvas(displayWidth,displayHeight);
  level = new Level;
  player = createSprite(100,100,10,10);
  edge = createEdgeSprites();
  player.speed = 5;
}
function draw() {
  background(255);  
  level.play();
  player.rotation = Math.atan2(mouseY-player.y, mouseX-player.x) * 180/PI;
  drawSprites();
}
player.collide(edge); //this part is from level.play()
var run = mouseX - player.x;
var rise = mouseY - player.y;
var length = sqrt((rise*rise) + (run*run));
var unitX = run / length;
var unitY = rise / length;
player.x += unitX * player.speed;
player.y += unitY * player.speed;

Также, если вы заметили, что при использовании camera.position вибрация происходит на определенном c расстоянии спрайта от мыши, и дело в том, что расстояние равно 0 прямо в центре холста и продолжает увеличиваться по мере удаления от центра.

1 Ответ

1 голос
/ 10 марта 2020

Эффект вибрация возникает потому, что положение объекта игрока изменяется постепенно и практически никогда не будет соответствовать положению мыши:

let player = {
  x: 100,
  y: 100,
  speed: 5,
  size: 10
}

function setup() {
  createCanvas(400, 150)
}

function draw() {
  background(150)
  movePlayer()
  rect(player.x, player.y, player.size)
}

function movePlayer(){
  var run = mouseX - player.x;
  var rise = mouseY - player.y;
  var length = sqrt((rise*rise) + (run*run));
  var unitX = run / length;
  var unitY = rise / length;
  player.x += unitX * player.speed;
  player.y += unitY * player.speed;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.0.0/p5.min.js"></script>

Но вы можете проверить, меньше ли расстояние между игроком и мышью, чем приращение, и заставляет положение быть таким же как у мыши:

let player = {
  x: 100,
  y: 100,
  speed: 5,
  size: 10
}

function setup() {
  createCanvas(400, 150)
}

function draw() {
  background(150)
  movePlayer()
  rect(player.x, player.y, player.size)
}

function movePlayer(){
  var run = mouseX - player.x;
  var rise = mouseY - player.y;

  //Check if the distance is less than the increment
  if(Math.abs(run) < player.speed && Math.abs(rise) < player.speed){
    player.x = mouseX
    player.y = mouseY
    return
  }

  var length = sqrt((rise*rise) + (run*run));
  var unitX = run / length;
  var unitY = rise / length;
  player.x += unitX * player.speed;
  player.y += unitY * player.speed;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.0.0/p5.min.js"></script>

Согласно "вибрация происходит на определенном c расстоянии спрайта от мыши" Я не вижу ничего связанного в коде, который вы разместили; но по описанию и видео, я думаю, это перевод вопрос.

...