Chrome 在 famo.us 中裁剪图像

Question

我有一个背景 (svg) 图像，我最初将放大查看该图像，然后在发生事件时该图像将缩小以适合页面。这在 Firefox 中运行良好，但在 Chrome 中图片在放大时被裁剪，因此当它应该适合页面时它周围有白色 space。我相信这是 Chrome 此处描述的优化器的一部分：http://famo.us/guides/pitfalls

那么我的问题是，我可以针对这个特定图像禁用此优化吗？或者还有其他解决办法吗？

编辑：无需查看 Chrome 优化器，已通过使用更好的缩放方法解决（来自下面的正确答案）。

Answer 1

尽管我们不知道您的用例，但这里有一个使用比例的示例。

Example jsBin (click on the image to resize)

  var mainContext = Engine.createContext();
  mainContext.setPerspective(1000);

  var mod = new StateModifier();

  var logo = new ImageSurface({
    content:  'http://code.famo.us/assets/famous_logo.svg',
    classes: ['double-sided']
  });
  logo._mod = new Modifier({
    size: [undefined, undefined],
    origin: [0.5, 0.5],
    align: [0.5, 0.5],
    transform: Transform.translate(0, 0, 0),
    proportions: [1.5, 1.5]
  });

  var mainMod = new Modifier({
    origin: [0.5, 0.5],
    align: [0.5, 0.5]
  });
  var rootnode = mainContext.add(mainMod);
  rootnode.add(logo._mod).add(logo);

  //logo._mod.setProportions([1.5, 1.5], {duration: 2000});

  logo.on('click', function(){
    if (!logo.small)
      logo._mod.setProportions([1,1], {duration: 1000});
    else
      logo._mod.setProportions([1.5, 1.5], {duration: 1000});

    logo.small = !logo.small;

  });

Chrome 在 famo.us 中裁剪图像

Chrome crops image in famo.us

google-chrome

famo.us