时间戳

首页 > 解决方案 > P5.JS Sketch 不会在浏览器中加载

browser - P5.JS Sketch 不会在浏览器中加载

问题描述

我有一个简单的程序，但我有一个问题。我之前在显示“正在加载...”的页面上遇到问题，但我解决了这个问题。每当我现在尝试加载时，我都会收到“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();
}

标签： browserloadingp5.js

解决方案

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

首先，在您的第一个 for 循环中，更改i = imgChange.length为i < imgChange.length. 其次，您在子弹类var的功能中缺少 a ： 。add()for( i = 0

现在，您的代码应该可以运行了。

推荐阅读