svg vs canvas - 浏览器游戏地图?

svg vs canvas - browser game map?

我正在尝试复制流行的网页游戏 Travian.com。我目前正在制作地图,我能够获得农场概览图像 png

我想用这张地图完成的是:

获得 farms.png 图片后,我使用在线工具将 png 转换为 .svg 文件。使用免费软件,我能够在每张地图周围画圈来构建我的 svg.

这是结果:

我最近读到有关 canvas 的信息,我想知道 canvas 是否比使用 svg 更好?

您需要自己尝试一下,看看重绘速度是否足够快,游戏对您的响应是否足够快。如果地图非常详细,重绘可能会太慢,让你的游戏感觉很慢。你真的需要试试看。如果它对您来说太慢,那么您可能需要:

  • 使用位图图像,或
  • 将地图保留为 SVG,但在首次加载时将它们渲染为 Canvas。这样,无论用户使用何种分辨率的屏幕,它们都会很清晰。