Added the Custom Effect of Sharpeness
@kvvasuu がすでに取り組んでいます。
2026年8月15日 から。
評価
この issue はまだ評価されていません。
説明
Figured out the sharpenss effect by myself, If anyone who needs it, here is the code
import React, { forwardRef, useMemo } from 'react'
import { SharpEffect } from './sharpness'
export const Sharpeness = forwardRef(({ sharpness = 5 }: { sharpness: number }, ref) => {
const effect = useMemo(() => new SharpEffect(sharpness), [sharpness])
return <primitive ref={ref} object={effect} dispose={null} />
})
import { Effect } from 'postprocessing'
import { Uniform, Vector2 } from 'three'
import fragmentShader from './sharpness.frag'
export class SharpEffect extends Effect {
constructor(sharpness = 1.0) {
super('SharpEffect', fragmentShader, {
uniforms: new Map([
['d', new Uniform(0)],
['iResolution', new Uniform(new Vector2())],
]),
})
this.resolution = new Vector2()
this.sharpness = sharpness
}
get sharpness() {
return this._Sharpness
}
set sharpness(value) {
this._Sharpness = value
this.setSize(this.resolution.width, this.resolution.height)
}
getSharpness() {
return this.sharpness
}
setSharpness(value) {
this.sharpness = value
}
setSize(width: number, height: number) {
const { resolution } = this
resolution.set(width, height)
this.uniforms.get('iResolution').value.x = resolution.x
this.uniforms.get('iResolution').value.y = resolution.y
this.uniforms.get('d').value = this.sharpness
}
}
glsl sharpen shader
uniform float d;
uniform vec2 iResolution;
void mainImage(const in vec4 inputColor, const in vec2 uv, out vec4 outputColor) {
float dx = d / iResolution.x;
float dy = d / iResolution.y;
vec4 sum = vec4(0.0);
sum += -1. * texture2D(inputBuffer, uv + vec2( -1.0 * dx , 0.0 * dy));
sum += -1. * texture2D(inputBuffer, uv + vec2( 0.0 * dx , -1.0 * dy));
sum += 5. * texture2D(inputBuffer, uv + vec2( 0.0 * dx , 0.0 * dy));
sum += -1. * texture2D(inputBuffer, uv + vec2( 0.0 * dx , 1.0 * dy));
sum += -1. * texture2D(inputBuffer, uv + vec2( 1.0 * dx , 0.0 * dy));
outputColor = sum;
}
<EffectComposer>
<Sharpeness sharpness={value} />
</EffectComposer>
- 主要言語
- TypeScript
- スター
- 1.4k
- フォーク
- 134
- 平均マージ
- 4分
- マージ済み PR(30日)
- 4
コントリビューションガイド
はじめの一歩
- issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
- 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
- リポジトリをフォークし、ブランチを切って変更します。
- issue 番号を参照したプルリクエストを送ります。
pmndrs/react-postprocessing のほかの issue
-
難易度 3/5 1〜2日 初心者へのやさしさ 42/100
pmndrs/react-postprocessing#343 · コメント 1 件 ·
-
難易度 4/5 3〜5日 初心者へのやさしさ 35/100
pmndrs/react-postprocessing#286 ·
-
難易度 3/5 1〜2日 初心者へのやさしさ 35/100
pmndrs/react-postprocessing#280 · コメント 2 件 · リアクション 1 件 ·
-
難易度 4/5 3〜5日 初心者へのやさしさ 25/100
pmndrs/react-postprocessing#240 · コメント 1 件 · リアクション 1 件 ·
-
enhancement
難易度 5/5 1週間以上 初心者へのやさしさ 20/100
pmndrs/react-postprocessing#183 ·
pmndrs/react-postprocessing の issue をすべて見る
似ている issue
-
難易度 2/5 1〜3時間 初心者へのやさしさ 70/100
-
難易度 2/5 1〜3時間 初心者へのやさしさ 75/100
mksglu/context-mode#1200 ·
-
難易度 2/5 1〜3時間 初心者へのやさしさ 75/100
jaegertracing/jaeger-ui#4506 ·
-
area:desktop area:ui bug platform:macos
難易度 2/5 1〜3時間 初心者へのやさしさ 75/100
anthropics/claude-code#96687 ·
-
good first issue
難易度 1/5 1時間未満 初心者へのやさしさ 95/100
AOSSIE-Org/DebateAI#582 · コメント 2 件 ·