首页 > 解决方案 > 问题 js Body sprite 未在 Firefox 中显示

问题描述

我的 matter.js 代码在 safari 和 chrome 中运行良好,但我在 Firefox 中进行了测试,它没有显示任何纹理。我没有错误信息。¿ 有什么办法可以修复它还是我错过了什么?

var myCanvas = document.getElementById('world');
var engine = Matter.Engine.create();
var world = engine.world;
var Body = Matter.Body;
var Events = Matter.Events;
var render = Matter.Render.create({
  canvas: myCanvas,
  element: document.getElementById("world_wrapper"),
  engine: engine,
  options: {
    width: window.innerWidth,
    height: window.innerHeight,
    background: '#FFF',
    wireframes: false,
    showAngleIndicator: false
  }
});


// This is one of the bodies

var letter_t = Matter.Bodies.rectangle(window.innerWidth/2 - 300, random_y, 94, 72, {
  density: density,
  friction: friction,
  frictionAir: frictionAir,
  restitution: restitution,
  render: {
    sprite: {
      texture: 'externalassets/t.svg',
      xScale: scale,
      yScale: scale,
    }
  }
});

Matter.World.add(world, letter_t);

标签: javascriptmatter.js

解决方案


我找到问题了!!!它是如此清晰......但我终于找到了它。只是firefox无法将svg文件作为纹理处理。如果您想使用具有透明度的文件,只需使用 png。


推荐阅读