小编nam*_*uol的帖子

缩放<canvas>时禁用插值

注意:这与放大时现有画布元素的渲染方式有关,与线条或图形在画布表面上的渲染方式无关.换句话说,这与缩放元素的插值有关,而与在画布上绘制的图形的抗锯齿无关.我不关心浏览器如何绘制线条; 我在乎的浏览器如何呈现canvas元素本身,当它被放大.


是否有画布属性或浏览器设置我可以通过编程方式更改以在缩放<canvas>元素时禁用插值?跨浏览器解决方案是理想的,但不是必需的; 基于Webkit的浏览器是我的主要目标.表现非常重要.

这个问题最相似,但没有充分说明问题.对于它的价值,我试图image-rendering: -webkit-optimize-contrast无济于事.

该应用程序将是一个用HTML5 + JS编写的"复古"8位风格的游戏,以明确我需要的东西.


为了说明,这是一个例子.(现场版)

假设我有一个21x21画布......

<canvas id='b' width='21' height='21'></canvas>
Run Code Online (Sandbox Code Playgroud)

...有css使元素大5倍(105x105):

canvas { border: 5px solid #ddd; }
canvas#b { width: 105px; height: 105px; } /* 5 * 21 = 105 */
Run Code Online (Sandbox Code Playgroud)

我在画布上绘制一个简单的'X',如下所示:

$('canvas').each(function () {
    var ctx = this.getContext("2d");
    ctx.moveTo(0,0);
    ctx.lineTo(21,21);
    ctx.moveTo(0,21);
    ctx.lineTo(21,0);
    ctx.stroke();
});
Run Code Online (Sandbox Code Playgroud)

左边的图像是Chromium(14.0)渲染的图像.右边的图像是我想要的(手绘为了说明目的).

Chrome会插入缩放的画布元素 非插值版本

javascript html5 canvas

121
推荐指数
3
解决办法
7万
查看次数

OpenGL:多个顶点的单顶点属性?

我有一个顶点着色器,它接受以下属性:

  • a_posCoord:顶点位置
  • a_texCoord:纹理坐标(传递给片段着色器)
  • a_alpha:透明度因子(传递给片段着色器)

我正在渲染的对象都是"广告牌"(一对直角三角形来制作一个矩形).

我正在使用单个调用来glDrawArrays渲染许多广告牌,每个广告牌都可能具有唯一的alpha值.单个广告牌有6个顶点.这里有一些伪代码来说明我如何为单个广告牌组织顶点属性缓冲区:

vertexAttributes = [

  px1,py1,pz1, // vertex 1: a_posCoord
  tx1,ty1,     // vertex 1: a_texCoord
  alpha,       // vertex 1: a_alpha

  px2,py2,pz2, // vertex 2: a_posCoord
  tx2,ty2,     // vertex 2: a_texCoord
  alpha,       // vertex 2: a_alpha

  px3,py3,pz3, // vertex 3: a_posCoord
  tx3,ty3,     // vertex 3: a_texCoord
  alpha,       // vertex 3: a_alpha

  px4,py4,pz4, // vertex 4: a_posCoord
  tx4,ty4,     // vertex 4: a_texCoord
  alpha,       // vertex 4: a_alpha

  px5,py5,pz5, // vertex 5: …
Run Code Online (Sandbox Code Playgroud)

shader opengl-es webgl vertex

13
推荐指数
1
解决办法
4419
查看次数

Knockout.js ViewModel改变回调?

我正在尝试在Knockout.js应用程序中实现自动保存功能.

有没有办法为ViewModel更改时分配回调?

javascript knockout.js

12
推荐指数
1
解决办法
4122
查看次数

为什么不从我的APK复制libgnustl_shared.so?

我有一个libs像这样的文件夹结构的android项目:

/libs
  /armeabi
    libfoo.so
    libbar.so
    libmystuff.so
    libgnustl_shared.so
  /armeabi-v7a
    libfoo.so
    libbar.so
Run Code Online (Sandbox Code Playgroud)

foo并且bar是第三方库,mystuff是我自己的库,来自一个单独的Android JNI项目,它需要gnustl_shared来自同一个JNI项目.

当我在Eclipse中构建项目时,我可以使用查看生成的APK的内容unzip -l,它确实显示所有这些库文件都已包含在内.

但是,安装APK后,即使其他库存在,该/data/data/com.myproject/lib文件夹也不包含libgnustl_shared.so.

这不可避免地导致以下错误:

UnsatisfiedLinkError: Couldn't load gnustl_shared: findLibrary returned null
Run Code Online (Sandbox Code Playgroud)

作为一个完整性检查,我运行adb push ./libs/armeabi/libgnustl_shared.so /data/data/com.myproject/lib并且确定,应用程序按预期启动.

我没有在构建日志或Eclipse控制台中看到任何建议构建或安装应用程序的任何问题.

  • 什么可能阻止libgnustl_shared.so我的应用程序安装?
  • 我在哪里可以了解安装APK时会发生什么?

如果我能提供任何可能有用的具体信息,请在评论中告诉我.

java-native-interface android android-ndk

9
推荐指数
1
解决办法
9535
查看次数

当DOM元素的计算样式发生变化时触发事件?

是否有非轮询方法来监听元素计算样式的更改?

这个幻想代码片段应该简洁地解释我的意思:

var el = document.getElementById('doodad');

el.addComputedStyleChangeListener('width', function (prev, new) {
  alert('Previous width: ' + prev + '; New width: ' + new);
});
Run Code Online (Sandbox Code Playgroud)

我知道DOMAttrModified突变事件和即将发生的事件MutationObserver,但两者都不够 - 它们只能用于观察style元素的DOM属性,这并不能完全确定元素的计算样式.


这个问题的用例原本就是这个问题的一部分,这真的只会引起我的好奇心.

javascript css dom

8
推荐指数
1
解决办法
2685
查看次数

GitHub API v3:确定用户是否是组织的所有者

如果您知道以下内容,则id很容易确定用户是否是团队成员:

GET /teams/:id/members/:user
Run Code Online (Sandbox Code Playgroud)

但是,如何才能轻松确定每个组织所拥有的特殊"业主"团队的ID?

据我所知,唯一的方法是检索所有团队的完整列​​表(我假设可能是多个页面?)并浏览它们,直到找到名为"Owners"的团队.

当然这是可行的,但对于GitHub的其他奇妙的API来说,这是非常不方便的.;)

为了它的价值,我尝试了以下(没有运气):

GET /orgs/:organization/teams?name=Owners # Lists all teams
GET /orgs/:organization/owners            # 404
Run Code Online (Sandbox Code Playgroud)

为了清楚起见,我已确保使用与拥有相关组织的用户相关联的令牌,因此不应存在任何授权问题.

github-api

7
推荐指数
1
解决办法
2183
查看次数

内容更改导致的过渡元素大小

我有一个按钮,里面有一些文字.按下它时,文本会发生变化.这使按钮的宽度发生变化.如果可以通过以下方式转换元素宽度的变化,那将是很好的:

#el {
    transition: width 150ms ease-out;
}
Run Code Online (Sandbox Code Playgroud)

当然,这仅在您明确更改width属性时有效.

有谁知道实现这种效果的优雅方式?这是一个(尚未发挥作用)的小提琴.

javascript css jquery html5 css3

6
推荐指数
1
解决办法
2844
查看次数

使用v8 :: Locker的正确方法是什么,为什么我必须使用它?

我正在尝试使用NDK在一个Android应用程序中嵌入v8.

我有一个看起来像这样的JNI模块(JNI映射代码未显示):

#include <jni.h>
#include <android/log.h>

#include <v8.h>
using namespace v8;

static jlong getMagicNumber() {
  HandleScope handle_scope;
  Persistent<Context> context = Context::New();
  Context::Scope context_scope(context);

  Handle<String> source = String::New("40 + 2");

  Handle<Script> script = Script::Compile(source);
  Handle<Value> result = script->Run();

  context.Dispose();

  return result->NumberValue();
}
Run Code Online (Sandbox Code Playgroud)

我第一次运行getMagicNumber,它正确运行并返回42.第二次我尝试运行它,它崩溃了.

具体来说,这ASSERT在v8中看到的isolate.h失败了:

// Returns the isolate inside which the current thread is running.
INLINE(static Isolate* Current()) {
  Isolate* isolate = reinterpret_cast<Isolate*>(
      Thread::GetExistingThreadLocal(isolate_key_));
  ASSERT(isolate != NULL);
  return isolate;
}
Run Code Online (Sandbox Code Playgroud)

这听起来很像这个问题,建议使用v8::Locker"独立访问隔离". …

java java-native-interface android v8

6
推荐指数
1
解决办法
3763
查看次数

如何使用Browserify指定自定义搜索路径?

我有一个大型项目,包含数百个分成几个文件夹的源文件.

像这样的东西:

src/
  AAA.js
  subdir/
    DDD.js
Run Code Online (Sandbox Code Playgroud)

我希望能够使用非相对路径指定依赖项.

例如,在DDD.js我想这样做:

var AAA = require('AAA');
Run Code Online (Sandbox Code Playgroud)

......而不是这个:

var AAA = require('../AAA');
Run Code Online (Sandbox Code Playgroud)

如何使用Browserify实现这一目标?

javascript node.js browserify

6
推荐指数
1
解决办法
3917
查看次数

JSON对象数组

早上好,

我是JSON的新手,我正在尝试使用JSON而不是某些二维数组重新实现页面.

我希望完成的是获取一系列对象.对象看起来像这样:

{ // Restaurant
  "location" : "123 Road Dr",
  "city_state" : "MyCity ST",
  "phone" : "555-555-5555",
  "distance" : "0"
}
Run Code Online (Sandbox Code Playgroud)

我想创建这些餐馆对象的数组,并用一些逻辑填充距离字段,然后根据距离字段对数组进行排序.

我对JSON很新.我可以创建一个JSON对象数组,还是有其他JSON实现这个目标?

非常感谢您的帮助.

凯文

javascript json object

4
推荐指数
3
解决办法
3万
查看次数