ነፃ ምስል አዙሪ እና ገልባጭ

እንዴት እንደሚሠራ

እዚህ ያለው ማሽከርከር፣ መገልበጥ እና የማዕዘን ማስተካከያ ሙሉ በሙሉ በአሳሽዎ ውስጥ HTML Canvas APIን በመጠቀም ይሠራሉ — ምንም ፋይል ወደ አገልጋይ በጭራሽ አይላክም። መሣሪያው ምስልዎን በተመረጠው ማዕዘን እና የመጠን ለውጦች ከማያ ገጽ ውጭ ባለ ሸራ ላይ ይስላል፣ ከዚያም ውጤቱን በአሳሹ የራሱ codec ወደ JPEG፣ PNG ወይም WebP ኮድ ያደርጋል።

1. 1
   ምስሉ በአካባቢው ይፈታል

   የJPEG፣ PNG ወይም WebP ፋይልዎ በአካባቢያዊ object URL — መሣሪያዎን በጭራሽ የማይለቅ የአሳሽ ማህደረ ትውስታ ማጣቀሻ — በኩል ወደ HTMLImageElement ይጫናል። ተፈጥሯዊዎቹ የፒክሰል ልኬቶች በቀጥታ ከተፈታው ቢትማፕ ይነበባሉ።
2. 2
   የCanvas ለውጥ ይተገበራል

   ከማያ ገጽ ውጭ ያለ ሸራ የተሽከረከረውን ወሰን ሳጥን እንዲይዝ መጠኑ ይዘጋጃል (ለእያንዳንዱ ዘንግ width·cos + height·sin)። ከዚያም የCanvas 2D አውድ ወደ መሀል ይዛወራል፣ በተመረጠው ማዕዘን በራዲያን ይሽከረከራል፣ ለመገልበጥም በአግድም ወይም በቁመት ዘንግ በ-1 ይለካል — ሁሉም ያለ ውጫዊ ላይብረሪ መደበኛ የctx.rotate / ctx.scale ስራዎች ናቸው።
3. 3
   ራስ-ሰር መከርከም ጥጎችን ያስወግዳል (አማራጭ)

   ቀጥ ያለ ማዕዘን ላልሆኑ ማሽከርከሮች፣ በእጅ የተጻፈ የጂኦሜትሪ ተግባር — largestInnerRect — በተሽከረከረው ወሰን ሳጥን ውስጥ የሚገባውን የመጀመሪያውን የገጽታ ጥምርታ ያለው ትልቁን ቀጥ ያለ አራት ማዕዘን ያሰላል፤ ስለዚህ ባለሦስት ማዕዘን ባዶ ጥጎቹ ምስሉን ሳያዛቡ ይወገዳሉ።
4. 4
   የአሳሹ codec ውጤቱን ኮድ ያደርጋል

   canvas.toBlob() የፒክሰል ውሂቡን ለአሳሹ አብሮገነብ የምስል ኢንኮደር ይሰጣል፤ ይህም በቀጥታ የሚያወርዱትን JPEG (ሊመረጥ የሚችል ጥራት እና ለግልጽ ጥጎች የዳራ ቀለም ያለው)፣ PNG ወይም WebP Blob ያመርታል።

ተዛማጅ መሳሪያዎች