Question

我无法理解为什么我的代码不起作用，圆圈正在绘制但不在画布的中心，并且它比应该的大得多并且像素化一样。任何建议，帮助非常感谢。

// safe code:
(function(global, library){

var spaceTime = function(container){

// if container is global object
if (typeof container === "object"){
  var cHeight = container.innerHeight;
  var cWidth = container.innerWidth;
}
// if container is a div box
else {
  var cHeight = container.style.height;
  var cWidth = container.style.width;
}
console.log("container is an "+typeof container);

// return unique instance each time sT is called
return new spaceTime.init(cHeight, cWidth);


}

// function constructor
spaceTime.init = function(height, width) {
  this.height = height;
  this.width = width;
}



// methods: override the default prototype property
spaceTime.prototype = {

checkDimensions: function() {
  console.log(this.height + this.width);
  console.log(this);
  return this;
},

sequence: function(divide) {

  // var getSize = this.getCentre(divide);
  var grow = this.expand(200);
  var box = this.setCanvas();
  // box.classList.add("box");
  document.body.appendChild(box);

  // nest this in a requestAnimationFrame and pass
  // the grow function to warp radius
  this.drawCircle(box, grow);

  return this;

},

// expands each unique instance.
expand: function(i) {
  i += 1;
  return i;
},

getCentre: function(axis) {
  // width axis
  if(axis === "x"){
    console.log(this.height / 2);
    return this.height / 2;

  }
  // height axis
  else if(axis === "y"){
    return this.width / 2;
  }
  // if undefined or the string doesn't match
  else{
    throw "please input an x or y axis to be proccessed";
  }
},

// canvas context object and it's api methods
drawCircle: function(c, radius) {

   var ctx = c.getContext("2d");

   var x = this.getCentre("x");
   var y = this.getCentre("y");
   console.log(x);
   console.log(y);

   // define the arc path
   ctx.beginPath();
   ctx.arc(x, y, radius, 0, 2 * Math.PI, false);
   ctx.fillStyle = 'green';
   ctx.fill();

   // stroke it
   ctx.StrokeStyle = "#aaa";
   ctx.stroke();

   console.log(ctx);
   console.log(radius);

},

// set up the canvas element
setCanvas: function() {
 var c = document.createElement("canvas");
 c.style.height = this.height + "px";
 c.style.width = this.width + "px";

 console.log("new canvas element created");

 return c;
}

}



// override the prototype object with our own one.
spaceTime.init.prototype = spaceTime.prototype;


// reference and expose library to be invoked.
global.sT = spaceTime;


}(window));








// instance 1 of wormhole library
var inst1 = sT(this);

// method chaining
inst1.checkDimensions().sequence();

Answer 1

你不是在这里混淆x和y轴吗？

using System;
using System.IO;
using System.IO.Compression;

namespace ConsoleApplication1
{
    class Program
    {
        static void Main(string[] args)
        {
            string zipPath = @"c:\example\start.zip";
            string extractPath = @"c:\example\extract";

            using (ZipArchive archive = ZipFile.OpenRead(zipPath))
            {
                foreach (ZipArchiveEntry entry in archive.Entries)
                {
                    if (entry.FullName.EndsWith(".txt", StringComparison.OrdinalIgnoreCase))
                    {
                        entry.ExtractToFile(Path.Combine(extractPath, entry.FullName));
                    }
                }
            } 
        }
    }
}

呃，可能，在定义画布大小时不应该使用getCentre: function(axis) { if(axis === "x"){ return this.height / 2; } else if(axis === "y"){ return this.width / 2; } ... }, drawCircle: function(c, radius) { ... var x = this.getCentre("x"); // will return this.height / 2 var y = this.getCentre("y"); // will return this.width / 2 console.log(x); console.log(y); ... }属性。看here

在浏览器窗口的中心渲染画布圆圈

1 个答案: