Question

由于之前的帖子，我已经有了一个环绕圆柱体的图像。

无法尝试将base64图像包裹在圆柱体周围。

该图片位于一个div中，该div的id为#nbdesigner_frontend_area img，该页面已经在页面上，而不是外部的src图像文件。

尝试将divg中的img.src更改为已经在页面上的base64图像。

有什么建议吗？我知道我很接近。关于小提琴的完整代码...

function loadUpperIMage() {
var img = new Image();


img.src = "http://res.cloudinary.com/pussyhunter/image/upload/v1488184107/500_F_97150423_M13q2FeAUZxxIx6CaPixHupprmyiVVli_skh6fe.jpg"
img.onload = function() {

  var iw = img.width;
  var ih = img.height;

  var xOffset = 102, //left padding
    yOffset = 110; //top padding

  //alert(ih)
  var a = 75.0; //image width
  var b = 10; //round ness

  var scaleFactor = iw / (4 * a);

  // draw vertical slices
  for (var X = 0; X < iw; X += 1) {
    var y = b / a * Math.sqrt(a * a - (X - a) * (X - a)); // ellipsis equation
    ctx.drawImage(img, X * scaleFactor, 0, iw / 9, ih, X + xOffset, y + yOffset, 1, 174);
  }
};
}

};

https://jsfiddle.net/n1r7dxnf/

Answer 1

在你的小提琴中，图像有一个id为nbdesigner_frontend_area的父元素 - 这个解决方案基于这个假设。

你可以简单地引用元素的.src，而不是像这样的东西：

img.src = "http://res.cloudinary.com/pussyhunter/image/upload/v1488184107/500_F_97150423_M13q2FeAUZxxIx6CaPixHupprmyiVVli_skh6fe.jpg"

......这样做：

var wrapImage = document.getElementById("nbdesigner_frontend_area").getElementsByTagName("img")[0];
img.src = wrapImage.src;

图像位于div的页面上，而不是src - 在HTML5 / JavaScript中围绕圆柱形对象包裹图像

1 个答案: