首頁 JS特效 其它特效 js上傳圖片並取色程式碼

js上傳圖片並取色程式碼

js上傳圖片並取色程式碼

js上傳圖片並取色代碼是一款本地圖片上傳取色器插件,點擊取色按鈕以取得圖片所包含的顏色代碼。

部分js程式碼

<script type="text/javascript">
	(() => {
		let obj = {};
		//获取DOM对象的方法
		let $ = function(id){
			return document.getElementById(id);
		}
		//获取预览图片路径
		let getObjectURL = function(file){
			let url = null ; 
			if (window.createObjectURL!=undefined) { // basic
				url = window.createObjectURL(file) ;
			} else if (window.URL!=undefined) { // mozilla(firefox)
				url = window.URL.createObjectURL(file) ;
			} else if (window.webkitURL!=undefined) { // webkit or chrome
				url = window.webkitURL.createObjectURL(file) ;
			}
			return url ;
		}
		//十六进制转换器
		let hexadecimal = function(num) {
			var r = parseInt(num).toString(16);
			if (r.length == 1) {
				return '0' + r;
			}
			return r.toUpperCase();
		}
		//判断颜色是否已存在
		let checkHasColor = function(arr, r, g, b) {
			for (var i = 0; i < arr.length; i++) {
				var n = equalsColor(arr[0], arr[1], arr[2], r, g, b);
				if (n >= 0.8) {
					return true;
				}
			}
			return false;
		}
		//判断相同颜色
		let equalsColor = function(r1, g1, b1, r2, g2, b2) {
			return (255 - Math.abs(r1 - r2) * 0.297 - Math.abs(g1 - g2) * 0.593 - Math.abs(b1 - b2) * 0.11) / 255;
		}
		//建立canvas画布
		let canvas = function(obj,size,param){
			let canvas = document.createElement("canvas");
			if (!canvas.getContext) {
				alert("很遗憾,您浏览器版本太老了,无法使用我们的小工具 !");
				return;
			}
	})()
</script>
免責聲明

本站所有資源皆由網友貢獻或各大下載網站轉載。請自行檢查軟體的完整性!本站所有資源僅供學習參考。請不要將它們用於商業目的。否則,一切後果都由您負責!如有侵權,請聯絡我們刪除。聯絡方式:admin@php.cn

相關文章

PHP 圖片上傳程式碼範例 PHP 圖片上傳程式碼範例

25 Jul 2016

PHP 圖片上傳程式碼範例

PHP swfupload圖片上傳的實例程式碼_PHP教程 PHP swfupload圖片上傳的實例程式碼_PHP教程

21 Jul 2016

PHP swfupload圖片上傳的實例程式碼。 PHP程式碼如下: 複製程式碼如下: if (isset($_FILES["Filedata"]) || !is_uploaded_file($_FILES["Filedata"]["tmp_name"]) || $_FILES["Filedata"][" error"] != 0) { $upload_f

生成器函數如何提升 Python 問題解決能力? 生成器函數如何提升 Python 問題解決能力?

26 Oct 2024

生成器函數:它們在解決問題中的效用產生器函數以其yield語句為特徵,提供了一種獨特的方法...

如何在 PHP 中用其基本等效字元替換特殊字元? 如何在 PHP 中用其基本等效字元替換特殊字元?

30 Oct 2024

在 PHP 中用其基本等效項替換特殊字元問題:是否可以用其基本等效項替換特殊字元...

為什麼我應該避免 `std::vector` 以及何時 `std::deque` 可能是更好的選擇? 為什麼我應該避免 `std::vector` 以及何時 `std::deque` 可能是更好的選擇?

15 Dec 2024

理解向量及其獨特的特徵斯科特·邁耶斯的“有效的STL”強調了避免矢量由於...

索引列順序如何影響資料庫查詢效能? 索引列順序如何影響資料庫查詢效能?

16 Jan 2025

索引列順序:效能的關鍵因素索引中列的排列會顯著影響其有效性。它是...

kinekt 簡介:用於建立 REST API 的打字稿優先 Web 框架 kinekt 簡介:用於建立 REST API 的打字稿優先 Web 框架

20 Dec 2024

我創建了一個名為 kinekt 的 Web 框架,並想將其介紹給社群: https://kinekt.dev Kinekt 是一個基於 Web 標準建構的 TypeScript 優先的高效能 Web 框架。它具有以下特點,使其與 o

從字串中過濾特殊字元最有效的方法是什麼? 從字串中過濾特殊字元最有效的方法是什麼?

01 Jan 2025

字串中的高效字元過濾本文解決了從字串中有效刪除特殊字元的任務,確保它...

如何安全地從多線程編程中的不同線程訪問UI控件? 如何安全地從多線程編程中的不同線程訪問UI控件?

03 Feb 2025

跨線程操作無效:從其他螺紋多線程編程訪問控件,遵循特定...

See all articles See all articles

Hot Tools

jQuery+Html5實作唯美表白動畫程式碼

jQuery+Html5實作唯美表白動畫程式碼

jQuery+Html5實作唯美表白動畫程式碼,動畫效果很棒,程式設計師表白必備!

情侶浪漫表白js特效程式碼

情侶浪漫表白js特效程式碼

情侶浪漫表白js特效程式碼,這樣的特效,可以用在婚禮攝影的網站上,也可以放在個人網站中,也還一個不錯的特效,php中文網推薦下載!

簡單js戀愛表白神器

簡單js戀愛表白神器

簡單原生js戀愛表白神器

碉堡的html5粒子動畫表白特效

碉堡的html5粒子動畫表白特效

碉堡的html5粒子動畫表白特效程式碼,動畫特效文字可以在程式碼裡面進行更改,大家可以做個頁面,大家可以自訂文字的輸入是應該是非常受歡迎的,此HTML5特效非常美的。

jQuery響應式後台登入介面模板

jQuery響應式後台登入介面模板

jQuery響應式後台登入介面範本html源碼,登入頁面透過jquery來驗證表單,判斷使用者名稱和密碼是否符合要求,通常登入頁面在企業網站或商城網站都是必須要用到的頁面,響應式的後台頁面,當瀏覽器放大或縮小,背景會根據瀏覽器來調整圖片的大小! php中文網推薦下載!