πŸ“˜ Programming 92

[μ˜μƒ 처리] ν™”μ†Œ 점 처리 - 디지털 μ˜μƒμ˜ μ‚°μˆ  μ—°μ‚°κ³Ό μ˜€λ²„ν”Œλ‘œμš° ν•΄κ²° 방법 (Clamping, Wrapping)

ν™”μ†Œ 점 처리 ν™”μ†Œ 점 μ²˜λ¦¬λŠ” μ›λž˜ ν™”μ†Œμ˜ κ°’μ΄λ‚˜ μœ„μΉ˜λ₯Ό λ°”νƒ•μœΌλ‘œ 단일 ν™”μ†Œ 값을 λ…λ¦½μ μœΌλ‘œ λ³€κ²½ν•˜λŠ” κΈ°μˆ μž…λ‹ˆλ‹€. λ‹€λ₯Έ ν™”μ†Œμ˜ 영ν–₯을 받지 μ•Šκ³ , λ‹¨μˆœνžˆ ν™”μ†Œ 점의 κ°’λ§Œ λ³€κ²½ν•˜κΈ° λ•Œλ¬Έμ— 포인트 μ²˜λ¦¬λΌκ³ λ„ν•©λ‹ˆλ‹€. ​ μ‚°μˆ , 논리, λ°˜μ „, 광도 보정, νžˆμŠ€ν† κ·Έλž¨ ν‰ν™œν™”, λͺ…μ•” λŒ€λΉ„ 슀트레칭 λ“± 기법이 λ‹€μ–‘ν•©λ‹ˆλ‹€. ​ 1) μ‚°μˆ  μ—°μ‚° ν™”μ†Œμ˜ 밝기 μ‘°μ •, λŒ€λΉ„ λ³€κ²½ ​ 2) 논리 μ—°μ‚° μ°Έ, 거짓을 νŒλ³„ν•˜λŠ” 논리 μ—°μ‚°(AND, OR, XOR, NOT)으둜 디지털 μ˜μƒμ—μ„œ 차폐, νŠΉμ§• μΆ”μΆœ, ν˜•νƒœ 뢄석을 μˆ˜ν–‰ ​ 3) νžˆμŠ€ν† κ·Έλž¨ (λ§‰λŒ€ κ·Έλž˜ν”„) κ΄€μΈ‘ν•œ 데이터가 λΆ„ν¬λœ νŠΉμ§•μ„ ν•œ λˆˆμ— μ•Œμ•„λ³΄κΈ° μ‰½κ²Œ λ‚˜νƒ€λ‚Έ κ·Έλž˜ν”„ κ°€λ‘œμΆ• - 레벨(μ˜μƒμ˜ 밝기), μ„Έλ‘œμΆ• - λΉˆλ„ 수(밝기 값에 λŒ€μ‘ν•˜λŠ” ν™”μ†Œ 수) ​ νžˆμŠ€ν† κ·Έλž¨μ„ λ‹€λ£¨λŠ”..

[μ˜μƒ 처리] 컬러 λͺ¨λΈ ( RGB, CMY, HSI )κ°„μ˜ 관계와 λ³€ν™˜

컬러 λͺ¨λΈ 색을 ν‘œν˜„ν•˜κ³ μž ν•˜λŠ” 방식이라 ν•  수 μžˆμŠ΅λ‹ˆλ‹€. λŒ€ν‘œμ μœΌλ‘œ RGB, CMY, HSIκ°€ μžˆμŠ΅λ‹ˆλ‹€. RGB 컬러 λͺ¨λΈ ​ RGB 컬러 λͺ¨λΈμ€ λΉ¨κ°•, 초둝, νŒŒλž‘μ΄λΌλŠ” 3가지 색상 값을 μ΄μš©ν•΄μ„œ 색을 ν‘œν˜„ν•©λ‹ˆλ‹€. 색을 ν˜Όν•©ν• μˆ˜λ‘ 색이 λ°μ•„μ§€λŠ” 가산체계(Additive System)을 μ‚¬μš©ν•©λ‹ˆλ‹€. ​ 1) RGBλ₯Ό 같은 λΉ„μœ¨λ‘œ ν˜Όν•© → κ°€μž₯ 밝은 흰색 Red(1, 0, 0) + Green(0, 1, 0) + Blue(0, 0, 1) = White(1, 1, 1) ​ 2) 빨강색 + μ΄ˆλ‘μƒ‰ → λ…Έλž€μƒ‰ Red(1, 0, 0) + Green(0, 1, 0) = Yellow(1, 1, 0) ​ 3) μ΄ˆλ‘μƒ‰ + νŒŒλž€μƒ‰ → 청둝색 Green(0, 1, 0) + Blue(0, 0, 1) = Cyan(0, 1, 1..

[μ˜μƒ 처리] μΈκ°„μ˜ λΉ›, κ°€μ‹œκ΄‘μ„ κ³Ό μƒ‰μ˜ ν‘œν˜„

λΉ›κ³Ό 색 인간은 인간이 λ³Ό 수 μžˆλŠ” λΉ›μ˜ μ˜μ—­μΈ κ°€μ‹œκ΄‘μ„ μœΌλ‘œ 색을 μΈμ‹ν•©λ‹ˆλ‹€. 파μž₯의 길이에 따라 μ„±μ§ˆμ΄ λ³€ν™”ν•˜μ—¬ 각각의 μƒ‰κΉ”λ‘œ λ‚˜νƒ€λƒ…λ‹ˆλ‹€. 빨간색에 κ°€κΉŒμšΈμˆ˜λ‘ 파μž₯이 κΈΈκ³ , 보라색에 κ°€κΉŒμšΈμˆ˜λ‘ 파μž₯이 μ§§μŠ΅λ‹ˆλ‹€. ​ 컬러 곡간은 μ–΄λ–€ 색깔과 λ‹€λ₯Έ μƒ‰κΉ”κ³Όμ˜ 관계λ₯Ό ν‘œν˜„ν•˜κΈ° 쒋은 논리적인 λ°©λ²•μž…λ‹ˆλ‹€. μš°λ¦¬κ°€ ν”νžˆ μ•„λŠ” RGBλŠ” λΉ¨κ°•, 초둝, νŒŒλž‘μœΌλ‘œ μ—¬λŸ¬ 색을 ν‘œν˜„ν•©λ‹ˆλ‹€. λ˜ν•œ, 컬러 곡간 HSIλŠ” 색상, 채도, λͺ…λ„λ‘œ μ—¬λŸ¬ 색을 ν‘œν˜„ν•©λ‹ˆλ‹€. ν•˜μ§€λ§Œ, κ°€μ‹œκ΄‘μ„  이외에 색도 μžˆμŠ΅λ‹ˆλ‹€. 적외선은 빨간색 λ°”κΉ₯의 μƒ‰μœΌλ‘œ 빨간색 보닀 파μž₯이 κΈ΄ κ΄‘μ„ μž…λ‹ˆλ‹€. 주둜, μ—΄ κ°μ§€λ‚˜ ꡰ사, μ˜λ£Œμ— μ‚¬μš©λ©λ‹ˆλ‹€. μžμ™Έμ„ μ€ 보라색 λ°”κΉ₯의 μƒ‰μœΌλ‘œ 보라색 보닀 파μž₯이 짧은 κ΄‘μ„ μž…λ‹ˆλ‹€. ν”ΌλΆ€ λ…ΈμΆœμ΄ 많으면 ν”ΌλΆ€ 암을 μΌμœΌν‚΅λ‹ˆλ‹€. 눈의 ..

[μ˜μƒ 처리] 디지털 μ˜μƒμ²˜λ¦¬λž€ ?

μ˜μƒμ²˜λ¦¬ (Digital Image Processing) μ˜μƒμ€ 2차원 ν•¨μˆ˜μΈ f(x,y)둜 μ •μ˜λ©λ‹ˆλ‹€. ​ μ•„λž˜ 그림은 디지털 이미지λ₯Ό μ’Œν‘œμƒμœΌλ‘œ ν‘œν˜„ν•œ κ·Έλ¦Όμž…λ‹ˆλ‹€. ​ 디지털 μ΄λ―Έμ§€λŠ” ν™”μ†Œ(Pixel)μ΄λΌλŠ” λ‹¨μœ„λ‘œ μ„Έλ°€ν•˜κ²Œ 2차원 ν˜•νƒœλ‘œ ν‘œν˜„λ©λ‹ˆλ‹€. ν™”μ†ŒλŠ” 2차원적 ν‘œν˜„μœΌλ‘œ x와 y의 κ°’μœΌλ‘œ μœ„μΉ˜λ₯Ό λ‚˜νƒ€λ‚΄λŠ” 곡간 μ’Œν‘œ(Spatial Coordiantes)둜 ν‘œν˜„ν•©λ‹ˆλ‹€. ​ λ˜ν•œ, ν•΄λ‹Ή μ’Œν‘œ (x, y)의 크기인 f(x, y)λŠ” ν•΄λ‹Ή ν™”μ†Œμ˜ 밝기(Intensity)​λ₯Ό ν‘œν˜„ν•©λ‹ˆλ‹€. λ˜λŠ” νšŒμƒ‰λ„(Gray Level)이라고도 ν•©λ‹ˆλ‹€. 디지털 μ˜μƒμ˜ 쑰건 1) x, y, f의 크기 값이 λͺ¨λ‘ μœ ν•œν•΄μ•Ό ν•œλ‹€. 2) x, y, f의 크기 값이 λͺ¨λ‘ 이산적인 값이어야 ν•œλ‹€. 디지털 μ‹ ν˜Έμ˜ μž₯점 1) 디지털 데이터..

CSR(Client Side Rendering)κ³Ό SSR(Server Side Rendering)

SPA와 MPA SPA (Single Page Application) : ν•˜λ‚˜μ˜ HTML νŒŒμΌμ„ 기반으둜 JSλ₯Ό μ΄μš©ν•΄ ν™”λ©΄μ˜ 컨텐츠λ₯Ό λ™μ μœΌλ‘œ λ°”κΎΈλŠ” λ°©μ‹μ˜ μ›Ή μ–΄ν”Œλ¦¬μΌ€μ΄μ…˜ (전톡적인 λ Œλ”λ§ 방식 : CSR) MPA (Multiple Page Application) : μ‚¬μš©μžκ°€ νŽ˜μ΄μ§€λ₯Ό μš”μ²­ν•  λ•Œλ§ˆλ‹€, μ›Ή μ„œλ²„κ°€ μš”μ²­ν•œ UI와 ν•„μš”ν•œ 데이터λ₯Ό HTML둜 νŒŒμ‹±ν•΄μ„œ λ³΄μ—¬μ£ΌλŠ” λ°©μ‹μ˜ μ›Ή μ–΄ν”Œλ¦¬μΌ€μ΄μ…˜ (전톡적인 λ Œλ”λ§ 방식 : SSR) CSR CSR에선 λΈŒλΌμš°μ €κ°€ μ„œλ²„μ— HTMLκ³Ό JS νŒŒμΌμ„ μš”μ²­ν•œ ν›„, λ‘œλ“œλ˜λ©΄ μ‚¬μš©μžμ˜ μƒν˜Έμž‘μš©μ— 따라 JSλ₯Ό μ΄μš©ν•΄μ„œ λ™μ μœΌλ‘œ λ Œλ”λ§μ„ μ‹œν‚¨λ‹€. μž₯점 첫 λ‘œλ”©λ§Œ 기닀리면, λ™μ μœΌλ‘œ λΉ λ₯΄κ²Œ λ Œλ”λ§ → μ‚¬μš©μž κ²½ν—˜(UX)이 μ’‹μŒ μ„œλ²„μ—κ²Œ μš”μ²­ν•˜λŠ” 횟수 훨씬 적음 → μ„œλ²„μ˜ λΆ€λ‹΄..