More SVG questions (and Javascript) - Interactivity [moving a rectangle] -

-

The following code should be rectangularized while pressing WASD keys on the keyboard. This does not work, the rectangle is not transferred, but no error occurs. How can I do this work? 

  & lt ;? Xml version = "1.0" encoding = "UTF-8" standalone = "no"? & Gt; & Lt ;! DOCTYPE svg PUBLIC "- // W3C / DTD SVG 1.1 / n" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> & Lt; Svg width = "90%" height = "90%" version = "1.1" xmlns = "http://www.w3.org/2000/svg" & gt; & Lt; Script type = "text / javascript" & gt; & Lt ;! [CDATA [var x; Var y; Function moves () {x = new number (document.getElementById ("player").); Y = new number (document.getElementById ("player"). Y); Switch (event.keyCode) {Case 119: y--; Document.getElementById ("player") y = y break; Case 115: y ++; Document.getElementById ("player") y = y break; Case 97: X-; Document.getElementById ("player") x = x break; Case 100: X ++; Document.getElementById ("player") x = x break; Default:}} document.documentElement.addEventListener ("keypress", move, right); ]] & Gt; & Lt; / Script & gt; & Lt; Rect x = "0" y = "0" height = "100%" width = "100%" style = "stroke-width: 5; stroke: black; fill: white" & gt; & Lt; / Rect & gt; & Lt; Rect x = "250" y = "250" id = "player" height = "50" width = "50" style = "stroke-width: 1; stroke: red; fill: red" & gt; & Lt; / Rect & gt; & Lt; / Svg & gt;  
 
 Your code above does not work because the objects are, those values ​​that represent You can change the  x = new number (document.getElementById (<)  
 The simplest changes are to make your code 'work':  
     
  1.  
     Change 
      x = new number (document.getElementById "player").);  
     
      x = new number (document.getElementById ("player") .x.baseVal.value);  
      (and so on)    
  2.  
     Change 
      document.getElementById ("player"). X = x;  
     
     
      document.getElementById ("player"). X.baseVal.value = x;  
      (and so on)     
     This will make your code work as desired, however, your code Usually can be improved.  
     Here's how I will write it (if you really want to move only one unit at a time):  
       & Lt; Script type = "text / javascript" & gt; & Lt ;! [CDATA [var key = {w: 87, a: 65, s: 83, d: 68}; Var rect = document.getElementById ('player'); Var x = rect.getAttribute ('x') * 1, y = rect.getAttribute ('y') * 1; Document.documentElement.addEventListener ("keydown", function (evt) {switch (evt.keyCode) {case key.av: rect.y.baseVal.value = --y; break; case KEY.s: rect.y. BaseVal.value = ++ y; Pause; Case KEY.a: rect.x.baseVal.value = --x; break; Case KEY.d: rect.x.baseVal.value = ++ x; break;}} , false); ]] & Gt; & Lt; / Script & gt; & Lt; / Svg & gt;   
     Note that I did not sign in to  & lt; Rect & gt;   above   & lt; Script & gt; The block has been moved so that a) the user looks at the rectangle before loading the script, but more importantly it is that b) a code which calls to  getElementById ()  Existed before If your script is blocked before defining your elements, then you have to set your code reference in response to the  onload  or similar event handler.

Comments

Post a Comment

Popular posts from this blog

qt - switch/case statement in C++ with a QString type -

-
I want to use switch-case in my program but the compiler generates an error. How can I use the switch statement with QString ? The compiler gives me this error: The expression of the switch type 'QString' is invalid My code is as follows : boolStopWord (the word QString) {bool flag = false; Switch (word) {case "the": flag = true; break ; "On" case: flag = true; break ; Case "in": flag = true; break ; Case "your": flag = true; break ; Case "near": flag = true; break ; Case "all": flag = true; break ; Case "this": flag = true; break ; } Return flag; } How do I use the switch statement with a Caststring ? You can not use the switch statement in C ++ language with integral or enum types. You can formally enter the square type of object in the switch statement, but this means that the compiler will look for a user-defined conversion to convert it to an integral or enum type.
Read more

python - sqlite3.OperationalError: near "REFERENCES": syntax error - foreign key creating -

-
I'm trying to create a predefined key after checking the manual and I wrote it: Db.execute ("create table" Table 2 (id, integer primary key, somedata integer) "db.execute" (table creation table 2 does not exist (name text, maintain reference (id) ") and found this: sqlite 3. Operation error: near" references ": syntax error Your second ligne is wrong db.execute ("create table if table does not exist 2 (name text, my_id integer, foreign key (my_id) reference Maintenance (ID)) ") as explained
Read more

Python's equivalent for Ruby's define_method? -

-
What is a Python equivalent for Ruby's define_method , which is the dynamic generation of class methods will allow? (As can be seen in Wikipedia) Functions are first-class objects in Python and assign them The properties of a class or an example can be a way of doing the same thing as a Wikipedia example: colors = {"black": "000", "red": "F00", "green": "0f0", "yellow": "ff0", "blue": "00f", "magenta": "fff", "cyan": "0ff", "white": " FFF "} Class MyStream (ARR): Pass for Name, Code in colors.iteritems (): def _in_colour ( W code = code): return '& lt; Span style = "color:% s" & gt;% s & lt; / Span & gt; ' % (Code, self) setter (histrive, "in_" + name, _in_ color)
Read more