滚动/缩放 pixi.js 画布

2024-06-26

下面是在 pixi.js(使用 WebGL)画布上放置一些文本的简单方法。

我们如何滚动/缩放画布的显示部分?(即鼠标按下+拖动应该移动...)

我想实现的示例:http://s419743653.onlinehome.fr/things/test2.htm http://s419743653.onlinehome.fr/things/test2.htm

<!DOCTYPE HTML>
<html>
<head>
    <title>pixi.js example 1</title>
    <script src="pixi.js"></script>
</head>
<body>
    <script>
    var stage = new PIXI.Stage(0xFFFFFF);
    var renderer = PIXI.autoDetectRenderer(800, 600);
    document.body.appendChild(renderer.view);
    var text = new PIXI.Text("Hello World", {font:"50px Arial", fill:"black"});
  stage.addChild(text);
  renderer.render(stage);   
    </script>
    </body>
</html>

设置缩放属性DisplayObjectContainer。在你的情况下,你没有任何东西,所以你可以缩放舞台。

stage.scale.x = 2;
stage.scale.y = 2;

或者您可以将对象放入一个组中并缩放该组。

var group = new Pixi.DisplayObjectContainer();
group.scale.x = 2;
group.scale.y = 2;

group.add(text);
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

滚动/缩放 pixi.js 画布 的相关文章

  • 强制浏览器打开文件而不是提示下载

    在 Firefox 和 Chrome 中单击 PDF 链接时 有时会打开该文件以在浏览器中查看 有时会提示 另存为 对话框 如果我想强制链接始终提示下载 我可以使用downloadHTML5 属性 然而 我想做相反的事情 IE 强制链接始终
  • 防止 Node.js 中的 SQL 注入

    是否有可能以与 PHP 具有防范 SQL 注入的预准备语句相同的方式防止 Node js 中的 SQL 注入 最好使用模块 如果是这样 怎么办 如果不 有哪些例子这可能会绕过我提供的代码 见下文 一些背景 我正在制作一个 Web 应用程序
  • 有效 JSON 上的 Firefox JSON“格式不正确”错误

    我在 Firefox 中收到以下错误消息 Error not well formed Source File http school courses booking add php 1287657494723 Line 1 Column 1
  • html/js 中从右到左和/或从上到下的文本?

    如何在浏览器中为用户输入创建从右到左和从上到下的文本字段 有没有本地方法可以做到这一点 或者也许有解决方法 从上到下可能像日语或象形文字 对于 RTL 文本字段 您可以使用 HTMLdir属性 如 ime Vidas 已经提到的 或 wit
  • 为什么 jQuery 对损坏标记的解释与浏览器不同?

    我之前已经回答过这个问题 https stackoverflow com a 19101905 1253312 但我并不完全理解why答案是正确的 答案的要点 p p function jqrender html a href http w
  • CSS @import 及其顺序

    是否可以使用 importone像这样的 css 文件 import file1 some css here import file2 chrome 无法识别上述第二个导入 但这可以工作 import file1 import file2
  • 如何在 Google 地图上旋转叠加图像?

    我正在尝试将一系列叠加层放置到 Google 地图上 我正在跟随地面覆盖层的示例代码 https developers google com maps documentation javascript examples groundover
  • html 基目录和子目录

    在我的 html 中我有 但我的链接全部转到 mydomain com 没有 dev 子文件夹 为什么我的链接没有指向子文件夹 提前致谢 编辑 我的链接html是 div ul li a href index html Home a li
  • 如何在传单地图上显示热图

    我想在我的传单地图上显示热图 我使用了 heatmap jshttps github com pa7 heatmap js https github com pa7 heatmap js但它最终只是显示 未捕获的类型错误 无法分配给只读属性
  • 持续运行的 C# 代码 - 服务还是单独的线程?

    我有一个 NET 4 Web 应用程序 它有 3 个关联的独立项目 DAL BAL 和 UI 我正在使用实体框架进行数据库交互 我有代码循环遍历一堆数据库数据 根据找到的内容调用方法 然后更新数据库 我希望这段代码一直运行 同时 我希望用户
  • 如何转义 onClick 处理程序内 JavaScript 代码中的字符串?

    也许我只是想得太难了 但我在弄清楚链接的 onClick 处理程序内的某些 JavaScript 代码中的字符串上使用什么转义时遇到了问题 例子 a href Select a The and 是发生模板替换的地方 我的问题是项目名称可以包
  • 脚本不会从nodejs应用程序中的ejs文件运行

    我正在尝试使用nodejs express mysql和ejs让网页显示图表 但我显然不明白ejs javascript等是如何工作的 我需要运行一个脚本来设置图表 来自 Chart js 模块 但它不会输出任何类型的图表 我尝试过的 将
  • 如何使用javascript将数据存储在xml文件中?

    我是 javascript 新手 并在我的项目中使用它 因为我需要读取 xml 文件 然后在操作后我想将更新后的值存储回 xml 文件中 我成功从 xml 文件获取值 但无法存储值返回到 xml 文件 这是我尝试过的代码
  • 从组件刷新/重新加载 ember 路由

    我有一个组件 它实际上是一个模式对话框 当我完成该对话框并按 确定 按钮时 我想留在打开该对话框的停留页面上 这并不难 但问题是该对话框更改了数据 我通过 REST 调用获取数据 因此我需要刷新已经所在的路线以反映数据更改 因为我是从组件中
  • Bootstrap 面板主体,内有表格

    我有一个引导面板 单击图标即可折叠并自动关闭 该面板内部包含一个全宽的表格 但只有在没有任何内容时才看起来像这样panel body 例如 这张桌子横跨面板的整个宽度和高度 看起来不错 但如果我可以有一个围绕桌子的类 我会更喜欢 但是 如果
  • 汇总异常以保留模块

    我使用一个名为的汇总插件rollup plugin lit css转变 css文件转换成 javascript 模块 该插件非常简单 它本质上只是附加export default到文件 我的汇总配置使用preserveModules and
  • React cloneElement 未设置键

    我正在构建一个动态生成键的表控件 我理解这可能不是一个好主意 我想键应该与其代表的数据唯一关联 否则 React 只能为我们生成唯一的 id 但无论哪种方式似乎没有设置按键 我不知道为什么 表中的行是用可以找到的函数生成的here http
  • 如何使用 jQuery 解析 JavaScript 对象

    jQuery JavaScript 中用于解析 JSON 对象并返回键 值对的 foreach 等效项是什么 JSON 对象 是什么意思 JSON 是一种用于序列化对象的文本格式 如果要循环访问通过反序列化 JSON 字符串获得的对象中的属
  • CSS 链接图像带有下划线(“a”显示设置为阻止)

    我有一个菜单 我希望每个单独的项目中文本周围的所有空间都能将用户带到指定的页面 我在网上查了一下 发现最好的解决方案是将 a 显示设置为阻止 如下 a display block height 100 text decoration und
  • 如何在流体宽度表中使用省略号而不使每列大小相同?

    假设我的表中的列是id name description and phone The description列的长度为 1 255 个字符 但 id 最多只有 3 个字符 我希望列的大小适当 而不是每列的大小相同 我想要descriptio

随机推荐