Added the Custom Effect of Sharpeness
@kvvasuu đang làm issue này rồi.
Từ ngày 15/8/2026.
Đánh giá
Issue này chưa được đánh giá.
Mô tả
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>
- Ngôn ngữ chính
- TypeScript
- Star
- 1.4k
- Fork
- 134
- Merge trung bình
- 4 phút
- Pull request đã merge (30 ngày)
- 4
Hướng dẫn đóng góp
Bắt đầu từ đâu
- Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
- Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
- Fork repository và làm thay đổi trên một nhánh.
- Mở pull request có tham chiếu số hiệu của issue.
Issue khác của pmndrs/react-postprocessing
-
Độ khó 3/5 1-2 ngày Mức phù hợp với người mới 42/100
pmndrs/react-postprocessing#343 · 1 bình luận ·
-
Độ khó 4/5 3-5 ngày Mức phù hợp với người mới 35/100
pmndrs/react-postprocessing#286 ·
-
Độ khó 3/5 1-2 ngày Mức phù hợp với người mới 35/100
pmndrs/react-postprocessing#280 · 2 bình luận · 1 reaction ·
-
Độ khó 4/5 3-5 ngày Mức phù hợp với người mới 25/100
pmndrs/react-postprocessing#240 · 1 bình luận · 1 reaction ·
-
Integrate realism-effects Đang mởenhancement
Độ khó 5/5 Hơn một tuần Mức phù hợp với người mới 20/100
pmndrs/react-postprocessing#183 ·
Tất cả issue của pmndrs/react-postprocessing
Issue tương tự
-
Type/Bug
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 78/100
OpenNSW/nsw-srilanka#497 ·
-
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 72/100
0xMiden/bridge-portal#132 ·
-
react-doctor severity:warning tech-debt
Độ khó 1/5 Dưới một giờ Mức phù hợp với người mới 88/100
digidem/comapeo-cloud-app#403 ·
-
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 72/100
-
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 78/100