Wie richtig zeichnen Boxen in der Verarbeitung?

Question

Ich versuche, ein sehr einfaches Feld Zeichenprogramm mit pyprocessing zu schreiben, aber eine Bedingung zu überprüfen, ob die Maus innerhalb einer Box versagt ist, wenn die Logik in Ordnung aussieht:

#!/usr/bin/env python 
from pyprocessing import * 

S = 20 
W = 5 
H = 5 

data = [[0] * W] * H 

def setup(): 
    size(W*(S+5),H*(S+5)) 

def draw(): 
    background(0) 
    for y in xrange(H): 
     for x in xrange(W): 
      fill(data[x][y] * 255) 
      rect(x*S,y*S,S,S) 

def mouseDragged(): 
    for y in xrange(H): 
     for x in xrange(W): 
      xs = x * S 
      ys = y * S 
      # this doesn't behave as expected: it should draw a single box if the condition is met, not the whole row 
      if (mouse.x >= xs) and (mouse.x <= (xs+S)) and (mouse.y >= ys and mouse.y <= (ys+S)): 
       if key.pressed: 
        data[x][y] = 0 
       else: 
        data[x][y] = 1 

run() 

ich habe versucht, gleicher Ansatz mit der Java-Version von Processing und es funktioniert wie erwartet:

int S = 20; 
int W = 5; 
int H = 5; 

int[][] data = new int[W][H]; 

void setup(){ 
    size(100,100); 
    noStroke(); 
} 

void draw(){ 
    background(0); 
    for (int y = 0 ; y < H; y++){ 
    for (int x = 0 ; x < W; x++){ 
     fill(data[x][y] * 255); 
     rect(x*S,y*S,S,S); 
    } 
    } 
} 
void mouseDragged(){ 
    for (int y = 0 ; y < H; y++){ 
    for (int x = 0 ; x < W; x++){ 
     int xs = x * S; 
     int ys = y * S; 
     if ((mouseX > xs) && (mouseX < (xs+S)) && (mouseY >= ys && mouseY <= (ys+S))){ 
     data[x][y] = 1; 
     } 
    } 
    } 
} 

Ein ähnliches Verhalten in JS:

var S = 20; 
 
var W = 5; 
 
var H = 5; 
 

 
var data = new Array(W); 
 

 
function setup(){ 
 
    createCanvas(100,100); 
 
    noStroke(); 
 
    for (var i = 0 ; i < H; i++) data[i] = [0,0,0,0,0]; 
 
    
 
} 
 

 
function draw(){ 
 
    background(0); 
 
    for (var y = 0 ; y < H; y++){ 
 
    for (var x = 0 ; x < W; x++){ 
 
     fill(data[x][y] * 255); 
 
     rect(x*S,y*S,S,S); 
 
    } 
 
    } 
 
} 
 
function mouseDragged(){ 
 
    for (var y = 0 ; y < H; y++){ 
 
    for (var x = 0 ; x < W; x++){ 
 
     var xs = x * S; 
 
     var ys = y * S; 
 
     if ((mouseX > xs) && (mouseX < (xs+S)) && (mouseY >= ys && mouseY <= (ys+S))){ 
 
     data[x][y] = 1; 
 
     } 
 
    } 
 
    } 
 
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.4.23/p5.min.js"></script>

Ich schreibe die Box Grenzen Bedingung in Python korrekt? Wenn ja, gibt es einen Fehler bei der Pyprocessing? Wie kann ich darüber hinwegkommen?

Ich verwende pyprocessing.version '0.1.3.22'

Answer 1

faul, um zu versuchen, ist die Frage:

data = [[0] * W] * H 

Dies nicht einfach eine verschachtelte Array erstellen, kopiert es die Referenzen des ersten Arrays ([0]), wenn ich also einen Wert in einer Zeile ändere, wird die ganze Zeile geändert.

Da ich bin super Erfahrung mit Python habe ich das Array in eine wahrscheinlich eine nicht-pythonic Weise initialisiert:

data = [] 
for y in xrange(H): 
    data.append([]) 
    for x in xrange(W): 
     data[y].append(0) 

So ist der volle Arbeitscode lautet:

#!/usr/bin/env python 
from pyprocessing import * 

S = 20 
W = 5 
H = 5 

# data = [[0] * W] * H #trouble 
data = [] 
for y in xrange(H): 
    data.append([]) 
    for x in xrange(W): 
     data[y].append(0) 

def setup(): 
    size(W*(S),H*(S)) 

def draw(): 
    background(0) 
    for y in xrange(H): 
     for x in xrange(W): 
      fill(data[x][y] * 255) 
      rect(x*S,y*S,S,S) 

def mouseDragged(): 
    for y in xrange(H): 
     for x in xrange(W): 
      xs = x * S 
      ys = y * S 
      if (mouse.x >= xs) and (mouse.x <= (xs+S)) and (mouse.y >= ys and mouse.y <= (ys+S)): 
       if key.pressed: 
        data[x][y] = 0 
       else: 
        data[x][y] = 1 

run()