p5.js - P5.js实例模式不适用于矩阵字母Rain

Question

我是一个非常漂亮的初学者，并且在P5.js中提供类，:(

试图弄清楚如何将P5.js实例模式与这个出色的教程结合在一起:p5.js中的Matrix Digital Rain与Emily Xie。

运行代码时，在第59行中有并且未捕获ReferenceError(“ undefined generateSymbols”)，但是在第155行中已经定义了this.generateSymbols ...

这里发生了什么事？

/* Poem Matrix
I am gonna risk, I am gonna risk the value of every single chance. Decent needs on time, part silence, part judgment.

I am gonna face, I am gonna face about ten people in a white hall praying for maintain the differences in a short conversation.

He stands up and draws a few steps across the living room. Then, he looks forward and she’s gone again. He stands up and draws a few steps across the living room. Then, he looks forward and she’s gone again.

*/ 


var letterRain = function ( l ) {
  
    var myFont;
    
   preload = function() {
       
    myFont = l.loadFont('fonts/CutiveMono-Regular.ttf');
    
    console.log("loaded");
       
};
    
   var canvas;

   var streams = [];

   var symbolSize = 30;
   
   
    
    windowResized = function() {
        
    l.resizeCanvas(l.windowWidth, l.windowHeight);
    
    console.log("window resized");
        
    };
    
      
    
  l.setup = function() {
      
       canvas = l.createCanvas(l.windowWidth, l.windowHeight);
      
       canvas.position(0, 0);
    
       canvas.style("z-index", "-1");

	//background(255);

	  var x = 0;
      
      console.log("canvas creado y posicionado")
      
      for (var i = 0; i < l.width / symbolSize; i++) {

		stream = new Stream();

		generateSymbols(x, l.random(-2000, 0));

		streams.push(stream);

		x += symbolSize

	};
      
      
	textSize(symbolSize);

	textFont(myFont);
      
    console.log("he pasado por el for");
      
};
    
    
  l.draw = function() {
      
    l.background(255);

	streams.forEach(function(stream){

	stream.render();

	});
      
      
      console.log("he pasado por el draw");
      
      
  }; 
    
   
  /* Symbol Class*/
  
  function Symbol (x, y, speed){

	this.x = x;

	this.y = y;

	this.value;

	this.speed = speed;

	this.switchInterval = l.round (l.random(90, 200));//el anterior era: 50, 100




	this.setToRandomSymbol = function() {

		if(frameCount % this.switchInterval == 0){

			var lyric = ["I am", "gonna", "risk", "the", "value", "of", "every", "single chance", "Decent", "needs", "on", "time", "part", "silence", "part judgment", "she’s gone again", "short conversation","looks forward", "draws", "conversation"] 

			this.value = 

          	lyric[l.floor(l.random(lyric.length))];		

		};
        //console.log("he pasado");

	};




	this.rain = function (){

	 this.y = (this.y >= height) ? 0 : this.y += this.speed;

	};
     console.log("rain");
};


  
  
  
  
  /* Stream Classs*/
    
    function Stream(){

	this.symbols = [];

	this.totalSymbols = l.round(l.noise (2, 8));//la anterior era random en vez de noise

	this.speed = l.random (1, 2);//controla la velocidad el anterior: 1 5 y random en veez de noise




	this.generateSymbols = function (x, y){

		for (var i = 0; i <= this.totalSymbols; i++){

			symbol = new Symbol(x, y, this.speed);

			symbol.setToRandomSymbol();

			this.symbols.push(symbol);

			y -= symbolSize;

		};
             console.log("final");
	};


	 this.render = function(){

	 	this.symbols.forEach(function(symbol){

	 		l.fill(0, 0, 0);

			text(symbol.value, symbol.x, symbol.y);

			symbol.rain();

			symbol.setToRandomSymbol();

	 	});

	 };
 
};

 
    
    
}; //final de la funcion l





new p5( letterRain );

Answer 1

您的代码未在我的计算机上运行，​​但我想我知道为什么它不起作用。

  for (var i = 0; i < l.width / symbolSize; i++) {

    stream = new Stream();

    stream.generateSymbols(x, l.random(-2000, 0));

    streams.push(stream);

    x += symbolSize

};

我认为您必须添加 stearm.generateSybols(...
希望这对您有所帮助