缩放后的表面内容质量差或者带有透视选项的Z-translate结果

Question

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

var surface = new Surface({
    content: 'im a content',
    size: [200, 200]
});
var modifier = new StateModifier();
mainContext.add(modifier).add(surface);

在onClick事件中，以下代码导致显示内容的质量非常差，即使是内容＆＃39;：
1）modifier.setTransform(Transform.translate(0, 0, 300));
或
2）modifier.setTransform(Transform.scale(3, 3, 1));

我在这里做错了什么？ 如何强制famo.us在转换后重新渲染内容以获得更好的质量？

Answer 1

这不是Famo.us的问题，因为它是浏览器。的 See the issue here. Windows Chrome浏览器？

<强> I tested it using this code. Example jsBin

• Chrome（39.0.2171.95）无效
• Firefox（31）工作
• IE（11.0.15）工作

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

  var surface = new Surface({
    content: 'Famous Application',
    size: [200, 200],
    transform: Transform.scale(1, 1, 1),
    properties: {
      fontSize: '2em',
      backgroundColor: 'rgba(0, 0, 0, 0.4)'
    }
  });
  var modifier = new Modifier({
    origin: [0, 0],
    align: [0, 0]
  });
  mainContext.add(modifier).add(surface);

  surface.on('click', function() {
    console.log('clicked');
    if (!surface.clicked) {
      //modifier.setTransform(Transform.translate(0, 0, 300));
      modifier.setTransform(Transform.scale(3, 3, 1), {duration: 300}, function(){surface.setContent('');surface.setContent('<div>Scaled Now!</div>');});

    }
    else {
      modifier.setTransform(Transform.scale(1, 1, 1), {duration: 300}, function(){surface.setContent('');surface.setContent('Famous Application');});
    }
    surface.clicked = !surface.clicked;
  });