------ Image Editor ------




Download 1,19 Mb.
Pdf ko'rish
bet10/11
Sana17.05.2024
Hajmi1,19 Mb.
#240613
1   2   3   4   5   6   7   8   9   10   11
Bog'liq
Kirish vazifalarhfd

------ Image Editor ------

 
 
 
 
 
 
Filters 
 
{ 
filterElement.map((v, 
i) 
=> 
className={property.name === v.name ? 'active' : ''} onClick={() => 
setProperty(v)} key={i} >{v.name}) 
} 
 
 
 
 
Rotate 
100% 
 

31 
name={property.name} 
onChange={inputHandle} 
value={state[property.name]} max={property.maxValue} type="range" /> 
 
 
Rotate & Filp 
 
 
 
 
onClick={horizentalFlip}>/> 
 
 
 
 
 
onClick={saveImage} 
className='save'>Save 
Image 
 
 
 
 

32 
{ 
state.image ?  
setCrop(c)}> 
onLoad={(e) 
=> 
setDetails(e.currentTarget)} 
style={{ 
filter: 
brightness(${state.brightness}%) 
brightness(${state.brightness}%) 
sepia(${state.sepia}%) saturate(${state.saturate}%) contrast(${state.contrast}%) 
grayscale(${state.grayscale}%) 
hue-rotate(${state.hueRotate}deg), 
transform: 
rotate(${state.rotate}deg) 
scale(${state.vartical},${state.horizental}) 
}} 
src={state.image} alt="" /> 
: 
 
 
Choose Image 
 
} 
 
 
onClick={undo} 
className='undo'>/> 
onClick={redo} 
className='redo'>/> 
{ 
crop 
&& 
onClick={imageCrop} 
className='crop'>Crop Image 

33 
} 
Choose Image 
 
 
 
 
 
 
) 
} 
export default Main 
Bu yerda algoritmning asosiy qismi berib o’tilgan.

34 
(2.1.2 - rasm) 
Ushbu proyekt natijasi : 

35 
( 2.1.3 – rasm ) Choose Image – orqali rasm tanlanadi 
( 2.1.4 – rasm ) 
(2.1.4 – rasm ) Filters qismidagi buttonlar tanlanadi va ranglanishi yorqinligi va 
to’yinganligi va hokazolar tanlanadi , Rotate qismi orqali foizlarda rasm 
ko’rinishini o’zgartirsa bo’ladi.

36 
( 2.1.5 – rasm ) 
( 2.1.5 – rasm ) Rotate & Flip qismida rasmni gorizontal va vertical yo’nalish 
bo’yicha aylantiriladi . 
( 2.1.6 – rasm ) 
2.1.6 – rasm . Bu rasmda sichqoncha bilan ikkita strelka o’ngga va chabga 
qaratilgani ko’rsatilgan. Bu strelgalar rasmlarda qilingan amallarni orqaga 

37 
qaytarish yoki oldinga o’tkazish , ya’ni rasmni avvalgi holiga o’tkazguncha 
jarayonni amalga oshirsh mumkin. 
( 2.1.7 – rasm ) 
2.1.7- rasmda : Rasmni o’ziz belgilagan qismizni qirqib olsangiz bo’ladi. Crop 
Image qismida rasm berilgan pxlarda qisqaradi . Save Image qismida o’zgartirilgan 
rasm saqlanadi. 
( 2.1.8 – rasm ) Proyektning to’liq qismi 

38 
XULOSA 
Loyixadan shuni xulosa qilish mumkinki , Tasvirlarga raqamli ishlov berish 
usullari va algoritmlari kompyuter grafika, kompyuter ko'rib chiqish va boshqa 
sohalarda keng qo'llaniladi. Ushbu usullar va algoritmlar tasvirlarni raqamli 
ma'nosini aniqlashda muhim ahamiyatga ega. Bu tasvirlarga raqamli ishlov 
berishning usullari va algoritmlari haqida umumiy tushunchani berdi. Bu sohadagi 
yangiliklar va rivojlanishlar esa davom etib kelmoqda va yangi usullar va 
algoritmlar paydo bo'lishi mumkin. 
Ishni bajarish natijasida quyidagi natijalarga erishildi : 
1.
JavaScript va JavaScript kutubxonalari orqali real proyekt amalga oshirildi. 
2.
Bu proyekt orqali ancha muhim bo’lgan ishlarni amalga oshirsa bo’ladi. 

39 

Download 1,19 Mb.
1   2   3   4   5   6   7   8   9   10   11




Download 1,19 Mb.
Pdf ko'rish