首頁 後端開發 php教程 Kindeditor編輯器新增圖片上傳浮水印實作方法

Kindeditor編輯器新增圖片上傳浮水印實作方法

Jan 30, 2018 pm 02:07 PM
kindeditor 上傳 編輯器

本文主要為大家詳細介紹了Kindeditor編輯器加圖片上傳浮水印功能,具有一定的參考價值,有興趣的小伙伴們可以參考一下,希望能幫助到大家。

KindEditor 是一套開源的線上HTML編輯器,開發人員可以用 KindEditor 把傳統的多行文字輸入框(textarea)替換為視覺化的富文本輸入框。可無縫地與 Java、.NET、PHP、ASP 等程式集成,比較適合在 CMS、商城、論壇、部落格、Wiki、電子郵件等網路應用程式上使用。
主要特點:

快速:體積小,載入速度快

開源:開放原始碼,高水平,高品質

底層:內建自訂DOM 類庫,精確操作DOM

擴展:基於插件的設計,所有功能都是插件,可根據需求增減功能

風格:修改編輯器風格非常容易,只需修改一個CSS檔案

相容:支援大部分主流瀏覽器,例如IE、Firefox、Safari、Chrome、Opera

轉到正題,預設的編輯器上傳圖片時,是沒有浮水印功能的,以下詳細介紹:

第一步:修改upload_json.php文件

#在編輯器的/php/目錄下可以找到這個文件,新增一個函數:


/*
  * 功能:PHP图片水印,水印支持图片或文字
  * 参数:
  * $groundImage 背景图片,即需要加水印的图片,暂只支持GIF,JPG,PNG格式;
  * $waterPos 水印位置,有10种状态,0为随机位置;
  *  1为顶端居左,2为顶端居中,3为顶端居右;
  *  4为中部居左,5为中部居中,6为中部居右;
  *  7为底端居左,8为底端居中,9为底端居右;
  * $waterImage 图片水印,即作为水印的图片,暂只支持GIF,JPG,PNG格式;
  * $alpha 水印透明度,取值1-100;
  * $waterText 文字水印,即把文字作为为水印,支持ASCII码,不支持中文;
  * $textFont 文字大小,值为1、2、3、4或5,默认为5;
  * $textColor 文字颜色,值为十六进制颜色值,默认为#FF0000(红色);
  *
  * $waterImage 和 $waterText 最好不要同时使用,选其中之一即可,优先使用 $waterImage。
  * 当$waterImage有效时,参数$waterString、$stringFont、$stringColor均不生效。
  * 加水印后的图片的文件名和 $groundImage 一样。
*/
function imageWaterMark($groundImage, $waterPos=0, $waterImage='', $alpha=80, $waterText='', $water_fontfile, $textFont=9, $textColor='#FF0000'){
  $isWaterImage = FALSE;
  $formatMsg = '不支持该图片格式!请使用GIF、JPG、PNG格式的图片。';
  $fontFile = $water_fontfile;
  //读取水印文件
  if(!empty($waterImage) && file_exists($waterImage)){
    $isWaterImage = TRUE;
    $water_info = getimagesize($waterImage);
    $water_w = $water_info[0];//取得水印图片的宽
    $water_h = $water_info[1];//取得水印图片的高
    switch($water_info[2]){//取得水印图片的格式
      case 1:$water_im = imagecreatefromgif($waterImage);break;
      case 2:$water_im = imagecreatefromjpeg($waterImage);break;
      case 3:$water_im = imagecreatefrompng($waterImage);break;
      default:die($formatMsg);
    }
  }
  //读取背景图片
  if(!empty($groundImage) && file_exists($groundImage)){
    $ground_info = getimagesize($groundImage);
    $ground_w = $ground_info[0];//取得背景图片的宽
    $ground_h = $ground_info[1];//取得背景图片的高
    switch($ground_info[2]){//取得背景图片的格式
      case 1:$ground_im = imagecreatefromgif($groundImage);break;
      case 2:$ground_im = imagecreatefromjpeg($groundImage);break;
      case 3:$ground_im = imagecreatefrompng($groundImage);break;
      default:die($formatMsg);
    }
  }else{
    alert("水印图片不存在!");
  }
  //水印位置
  if($isWaterImage){//图片水印
    $w = $water_w;
    $h = $water_h;
    $label = "图片的";
  }else{//文字水印
    $temp = imagettfbbox($textFont, 0, $fontFile, $waterText);//取得使用 TrueType 字体的文本的范围
    $w = $temp[2] - $temp[6];
    $h = $temp[3] - $temp[7];
    unset($temp);
    $label = "文字区域";
  }
  if(($ground_w<$w) || ($ground_h<$h)){
    echo "需要加水印的图片的长度或宽度比水印".$label."还小,无法生成水印!";
    return;
  }
  switch($waterPos){
    case 0://随机
    $posX = rand(0,($ground_w - $w));
    $posY = rand(0,($ground_h - $h));
    break;
    case 1://1为顶端居左
    $posX = 0;
    $posY = 0;
    break;
    case 2://2为顶端居中
    $posX = ($ground_w - $w) / 2;
    $posY = 0;
    break;
    case 3://3为顶端居右
    $posX = $ground_w - $w;
    $posY = 0;
    break;
    case 4://4为中部居左
    $posX = 0;
    $posY = ($ground_h - $h) / 2;
    break;
    case 5://5为中部居中
    $posX = ($ground_w - $w) / 2;
    $posY = ($ground_h - $h) / 2;
    break;
    case 6://6为中部居右
    $posX = $ground_w - $w;
    $posY = ($ground_h - $h) / 2;
    break;
    case 7://7为底端居左
    $posX = 0;
    $posY = $ground_h - $h;
    break;
    case 8://8为底端居中
    $posX = ($ground_w - $w) / 2;
    $posY = $ground_h - $h;
    break;
    case 9://9为底端居右
    $posX = $ground_w - $w;
    $posY = $ground_h - $h;
    if(!$isWaterImage){
    $posY = $ground_h - $h-20;
    }
    break;
    default://随机
    $posX = rand(0,($ground_w - $w));
    $posY = rand(0,($ground_h - $h));
    break;
  }
  //设定图像的混色模式
  imagealphablending($ground_im, true);
  if($isWaterImage){//图片水印
    //imagecopy($ground_im, $water_im, $posX, $posY, 0, 0, $water_w,$water_h);//拷贝水印到目标文件
    //生成混合图像
    imagecopymerge($ground_im, $water_im, $posX, $posY, 0, 0, $water_w, $water_h, $alpha);
  } else {//文字水印
    if( !empty($textColor) && (strlen($textColor)==7)){
      $R = hexdec(substr($textColor,1,2));
      $G = hexdec(substr($textColor,3,2));
      $B = hexdec(substr($textColor,5));
    } else {
      die("水印文字颜色格式不正确!");
    }
    imagestring($ground_im, $textFont, $posX, $posY, $waterText, imagecolorallocate($ground_im, $R, $G, $B));
  }
  //生成水印后的图片
  @unlink($groundImage);
  switch($ground_info[2]){//取得背景图片的格式
    case 1:imagegif($ground_im,$groundImage);break;
    case 2:imagejpeg($ground_im,$groundImage,100);break;//注意这里的100,经测试,100是图片质量最佳的,但文件大小会增加很多,95的时候质量还不错,大小和原来的差不多。作者采用95的值。
    case 3:imagepng($ground_im,$groundImage);break;
    default:die($errorMsg);
  }
  //释放内存
  if(isset($water_info)) unset($water_info);
  if(isset($water_im)) imagedestroy($water_im);
  unset($ground_info);
  imagedestroy($ground_im);
}
登入後複製

第二步:找到$json = new Services_JSON();注意有兩個地方,不是在alert函數裡的那個,添加如下程式碼:


 /* 水印配置开始 */
  $water_mark = 1;//1为加水印, 其它为不加
  $water_pos = 9;//水印位置,10种状态【0为随机,1为顶端居左,2为顶端居中,3为顶端居右;4为中部居左,5为中部居中,6为中部居右;7为底端居左,8为底端居中,9为底端居】
  $water_img = $_SERVER[&#39;DOCUMENT_ROOT&#39;].&#39;/upfiles/water.gif&#39;;//水印图片,默认填写空,请将图片上传至网站根目录的upfiles下,例: water.gif
  $water_alpha = 50;//水印透明度
  $water_text = &#39;&#39;;//水印字符串,默认填写空;
  //$water_fontfile = $_SERVER[&#39;DOCUMENT_ROOT&#39;] .&#39;/upfiles/fonts/arial.ttf&#39;;//文字水印使用的字体;
  if($water_mark == 1){
    imageWaterMark($file_path, $water_pos, $water_img, $water_alpha, $water_text, $water_fontfile);
  }
  /* 水印配置结束 */
登入後複製

經過本人測試可以正常使用,另外一點請注意水印圖片的路徑,根據實際情況而定。

相關推薦:

PHP實作可新增浮水印與產生縮圖處理工具

PHP根據圖片色區位置加浮水印

百度編輯器新增圖片浮水印功能

#

以上是Kindeditor編輯器新增圖片上傳浮水印實作方法的詳細內容。更多資訊請關注PHP中文網其他相關文章!

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

AI Hentai Generator

AI Hentai Generator

免費產生 AI 無盡。

熱門文章

R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
1 個月前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳圖形設置
1 個月前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.如果您聽不到任何人,如何修復音頻
1 個月前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.聊天命令以及如何使用它們
1 個月前 By 尊渡假赌尊渡假赌尊渡假赌

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

如何解決 Windows 11 中的檔案名稱或副檔名過長的問題? 如何解決 Windows 11 中的檔案名稱或副檔名過長的問題? Apr 22, 2023 pm 04:37 PM

您在傳輸文件時是否遇到任何問題,並且禁止您這樣做?好吧,許多Windows用戶最近報告說,他們在將檔案複製並貼上到資料夾時遇到了問題,其中拋出了一個錯誤,提示「目標資料夾的檔案名稱太長」。此外,其他一些Windows用戶在打開任何文件時表示失望,並說“文件名或擴展名太長”,他們無法打開文件。這不允許他們將文件傳輸到任何其他資料夾,這讓用戶感到失望。在分析問題時,我們提出了一系列解決方案,可能有助於緩解問題,使用者可以輕鬆傳輸檔案。如果您也遇到類似情況,請參閱此貼文以了解更多資訊。來源:https

如何在Windows 11、10中關閉Windows Defender智慧畫面? 如何在Windows 11、10中關閉Windows Defender智慧畫面? Apr 26, 2023 am 11:46 AM

許多Windows用戶最近報告說,當WindowsDefenderSmartScreen警告用戶不要啟動MicrosoftWindows無法識別的應用程式時,他們感到惱火,他們每次都必須點擊「仍然運行」選項。 Windows用戶不確定他們目前可以做些什麼來避免或停用它。在研究了這個問題後,我們發現系統上的WindowsDefender功能可以透過設定應用程式或本機群組原則編輯器或透過調整登錄檔來停用。透過這樣做,使用者將不再需要面對防守者SmartScreen。如果您的系統也遇到

15 款 Python 編輯器/ IDE 細緻攻略,總有一款適合你! 15 款 Python 編輯器/ IDE 細緻攻略,總有一款適合你! Aug 09, 2023 pm 05:44 PM

寫 Python 程式碼最好的方式莫過於使用整合開發環境(IDE)了。它們不僅能讓你的工作更加簡單、更具邏輯性,還能夠提升程式設計體驗和效率。每個人都知道這一點。而問題在於,如何從眾多選項中選擇最佳的 Python 開發環境。

如何在FastAPI中實現檔案上傳和處理 如何在FastAPI中實現檔案上傳和處理 Jul 28, 2023 pm 03:01 PM

如何在FastAPI中實現檔案上傳和處理FastAPI是一個現代化的高效能Web框架,簡單易用且功能強大,它提供了原生支援檔案上傳和處理的功能。在本文中,我們將學習如何在FastAPI框架中實作檔案上傳和處理的功能,並提供程式碼範例來說明具體的實作步驟。首先,我們需要導入需要的函式庫和模組:fromfastapiimportFastAPI,UploadF

C語言程式設計必備軟體:五個推薦給初學者的好幫手 C語言程式設計必備軟體:五個推薦給初學者的好幫手 Feb 20, 2024 pm 08:18 PM

C語言作為一門基礎而重要的程式語言,對於初學者來說,選擇合適的程式設計軟體是非常重要的。在市面上有許多不同的C語言程式設計軟體可供選擇,但對於初學者來說,適合自己的選擇可能有些困惑。本文將推薦給初學者的五個C語言程式設計軟體,幫助他們快速入門並提升程式設計能力。 Dev-C++Dev-C++是一款免費開源的整合開發環境(IDE),特別適合初學者使用。它簡單易用,整合了編輯器、

酷狗上傳自己的音樂的簡單步驟 酷狗上傳自己的音樂的簡單步驟 Mar 25, 2024 pm 10:56 PM

1.打開酷狗音樂,點選個人頭像。 2、點選右上角設定的圖示。 3.點選【上傳音樂作品】。 4.點選【上傳作品】。 5.選擇歌曲,然後點選【下一步】。 6.最後點選【上傳】即可。

如何在QQ音樂上傳歌詞 如何在QQ音樂上傳歌詞 Feb 23, 2024 pm 11:45 PM

隨著數位時代的到來,音樂平台成為人們獲取音樂的主要途徑之一。然而,有時候我們在聽歌的時候,發現沒有歌詞是一件十分困擾的事。許多人都希望在聽歌的時候能夠展現歌詞,以便更好地理解歌曲的內容和情感。而QQ音樂作為國內最大的音樂平台之一,也為用戶提供了上傳歌詞的功能,使得用戶可以更好地享受音樂的同時,感受到歌曲的內涵。以下將介紹一下在QQ音樂上如何上傳歌詞。首先

Win10電腦上傳速度慢怎麼解決 Win10電腦上傳速度慢怎麼解決 Jul 01, 2023 am 11:25 AM

  Win10電腦上傳速度慢怎麼解決?我們在使用電腦的時候可能會覺得自己電腦上傳檔案的速度非常的慢,那麼這是什麼情況呢?其實這是因為電腦預設的上傳速度為20%,所以才導致上傳速度非常慢,很多小夥伴不知道怎麼詳細操作,小編下面整理了win11格式化c碟操作步驟,如果你有興趣的話,跟著小編一起往下看看吧!  Win10上傳速度慢的解決方法  1、按下win+R調出運行,輸入gpedit.msc,回車。  2、選擇管理模板,點選網路--Qos封包計畫程序,雙擊限制可保留頻寬。  3、選擇已啟用,將帶

See all articles