javascript - Painting Cells in Grid -


I have an installation of JSFDial here. I am pulling a canvas grid and want to allow a user to select a color and grid cells like 'pixel art'. Can anyone point me in the right direction?

  var c_canvas = document.getElementById ("c"); Var reference = c_canvas.getContext ("2D"); For (var x = 0.5; x & lt; 501; x + = 20) {context.moveTo (x, 0); Context.lineTo (x, 381); } For (var y = 0.5; y & lt; 381; y + = 20) {context.moveTo (0, y); Context.lineTo (500, Y); } Context.strokeStyle = "#ddd"; Context.stroke ();    

OK, it should take you closer.

  function getMousePos (canvas, EVT) {var rect = canvas.getBoundingClientRect (); Return {x: evt.clientX - rect.left, y: evt.clientY - rect.top}; } Function getNearestSquare (status) {var x = position.x; Var y = position.y; If (x & lt; 0; y and lieutenant; 0) returns empty; X = (Math.flur (x / 20) * 20) + 0.5 y = (Math Flower (y / 20) * 20) + 0.5 returns {x: x, y: y}; } $ (C_canvas) .click (function (evt) {var pos = getNearestSquare (getMousePos (c_canvas, evt); if (pause! = Null) {context.fillStyle = "# FF0000"; context.fillRect (pos.x , Pos.y, 20,20);}});   

I tried to do this on your Bella, adding this JS code has given you a click event that gives you an area of ​​size and color of one of its squares Press, you just

Edit: I've added the logic to find the top left.

Comments

Popular posts from this blog

java - ImportError: No module named py4j.java_gateway -

python - Receiving "KeyError" after decoding json result from url -

.net - Creating a new Queue Manager and Queue in Websphere MQ (using C#) -