P5.JS草图不会在浏览器中加载

问题描述 投票:0回答:1

我有一个简单的程序,用十字准线替换您的鼠标,并在单击时对子弹进行动画处理。我以前以前在显示“正在加载...”的页面时遇到问题,但已解决了该问题。每当我现在尝试加载它时,它都会显示“ localhost拒绝连接”。我已经遍及整个互联网,但所有错误修正似乎都是针对我之前遇到的错误。如何正确加载?如果有人感兴趣,下面是代码:

let pew;
let crosshair;
let imgConst = 100;
var imgSize = imgConst;
var imgChange = [4, (6 + 2/3), 10, -10, -10, -10, -10, -20, (-33 - 1/3), -50];
for(var i = 0; i = imgChange.length; i++) {
  imgChange[i] = imgSize + imgConst/imgChange[i]
  console.log(i)
}
function preload() {
  crosshair = loadImage('crosshair.png')
}

function setup() {
  createCanvas(windowWidth, windowHeight);
  frameRate(10);
    noStroke();
    noCursor();
    pew = new bullet();
}

function draw() {
  background(50, 89, 100);
    //Shrink bullets
    pew.shrink()

    //crosshair
    image(crosshair, mouseX - imgSize/2, mouseY - imgSize/2, imgSize, imgSize);
}

// bullet class
class bullet {
  constructor() {
    this.x = [];
        this.y = [];
        this.size = [];
        this.shrinkSpeed = 1;
        this.diameter = 10;
  }

  shrink() {
        fill(61, 41, 15)
        for(var i = 0; i < this.x.length; i++) {
            if(this.size[i] <= 1) {
                this.size.splice(i);
            } else {
                ellipse(this.x[i], this.y[i], this.size[i], this.size[i]);
                this.size[i] = this.size[i] - this.shrinkSpeed;
            }
        }
  }
    add() {
        this.x.push(mouseX);
        this.y.push(mouseY);
        this.size.push(this.diameter)
        for( i = 0; i < imgChange.length * 1; i ++) {
          imgSize = imgChange[floor(i)]
          console.log(imgSize);
        }
    }
}

function mousePressed() {
  //add bullet
    pew.add();
}

很抱歉,代码太混乱了,我已经有一段时间没有编码了。

browser loading p5.js
1个回答
1
投票

您在for循环中有2个问题。

首先,在您的第一个for循环中,将i = imgChange.length更改为i < imgChange.length。其次,您在项目符号类的var函数中缺少add()for( i = 0

现在,您的代码应运行。

© www.soinside.com 2019 - 2024. All rights reserved.