रंग चोर काम नहीं करेगा ...

मैं Color Thief का उपयोग करना चाहता हूं, एक स्क्रिप्ट जो आपको छवि के प्रमुख रंग को निकालने की अनुमति देती है।रंग चोर काम नहीं करेगा ...

दुर्भाग्यवश मैं कोड को काम करने में सक्षम नहीं हूं। मैं प्रमुख रंग को mydiv नामक एक div का पृष्ठभूमि रंग होना चाहता हूं।

यहाँ मैं अब तक है: http://jsfiddle.net/srd5y/4/

अपडेट किया गया कोड/पार जोड़ने मुद्दों की वजह से मेरे अपने सर्वर में स्थानांतरित: http://moargh.de/daten/color-thief-master/test.html

जे एस

var sourceImage = 'https://www.google.de/intl/de_ALL/images/logos/images_logo_lg.gif'; 
var colorThief = new ColorThief(); 
colorThief.getColor(sourceImage);

एचटीएमएल

<div id="mydiv"></div>

किसी भी मदद के लिए धन्यवाद!

स्रोत

2013-09-03 user1706680

jsfiddle में, color-thief.js में जावास्क्रिप्ट के बजाय HTML मार्कअप शामिल है। त्रुटि कंसोल की जांच करें। – akonsu

इसके लिए खेद है-यह तय है। – user1706680

आपके बेवकूफ उदाहरण के लिए मुझे नहीं लगता कि रंग चोर क्रॉस-डोमेन – Murtnowski

प्रयास करें: आप इसे एक छवि अपने खुद के डोमेन पर होस्ट पर चल रहे हैं, तो आप सिर्फ एक यूआरएल के बजाय एक img तत्व के साथ getColor कॉल करने की आवश्यकता यह आपके कोड और हर किसी के उत्तरों के मिश्रण पर आधारित है। कलर थीफ का उपयोग करने से पहले आपको छवि को लोड करने की प्रतीक्षा करनी होगी। photo1.jpg के लिए रंग [125, 190, 193]

धन्यवाद @Shadow जादूगर और @ejegg

होना चाहिए देखें Official way to ask jQuery wait for all images to load before executing something

संपादित: ठीक उपयोग इस बेला जो काम करता है http://jsfiddle.net/bgYkT/

<head> 

    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 


    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
    <script src="js/color-thief.js"></script> 


    <style type="text/css"> 
     #mydiv { 
      width: 100px; 
      height: 100px; 
      border: 1px solid #000; 
     } 
    </style> 

</head> 


<body> 

    <img src="img/photo1.jpg" id="myimg" /> 

    <div id="mydiv"></div> 


    <script> 
     $(window).ready(function(){ 
     var sourceImage = document.getElementById("myimg"); 
     var colorThief = new ColorThief(); 
     var color = colorThief.getColor(sourceImage); 
     document.getElementById("mydiv").style.backgroundColor = "rgb(" + color + ")"; 
     }); 
    </script> 

</body>

स्रोत

2013-09-03 20:50:13 Murtnowski

मैंने हैंडलर जोड़ा लेकिन यह अभी भी काम नहीं करता है। http://moargh.de/daten/color-thief-master/test.html – user1706680

@ user1706680 गुमशुदा अंत) लाइन 42 – Murtnowski

धन्यवाद, अपडेट किया गया! लेकिन अभी भी कोई पृष्ठभूमि रंग नहीं है। – user1706680

मर्टनोव्स्की यह कहने में सही है कि यदि आप इसे किसी भिन्न डोमेन पर होस्ट की गई छवि के विरुद्ध चलाते हैं तो ऑपरेशन विफल हो जाएगा।

एचटीएमएल

<img src="/images/foo.jpg" id="myImg" />

जे एस

var sourceImage = document.getElementById("myImg"); 
var colorThief = new ColorThief(); 
colorThief.getColor(sourceImage);

स्रोत

2013-09-03 20:30:11 ejegg

धन्यवाद, मैं आपके सुझावों में निर्माण करता हूं और क्रॉस-लिंकिंग समस्या के कारण इसे अपने सर्वर पर अपलोड करता हूं: http://moargh.de/daten/color -फिफ-मास्टर/test.html मुझे 'colorThief' चर का मान कैसे प्राप्त होगा? – user1706680

@ user1706680 आपको इसे मैन्युअल रूप से सेट करने की आवश्यकता है उदा। 'var color = colorThief.getcolor (स्रोत छवि); document.getElementById ("mydiv")। style.backgroundcolor = "rgb (" + color + ")"; ' –

धन्यवाद, मैंने कोड अपडेट किया है लेकिन यह अभी भी काम नहीं करता है ... मैंने इवेंट हैंडलर मुर्तनोव्स्की को भी सुझाव दिया। – user1706680

मैं काम करने के लिए color-thief प्राप्त करने के लिए कुछ घंटों तक संघर्ष कर रहा था। अंत में यह [0] के छोटे इसके पहले सरणी तत्व को इंगित करने के लिए था:

<img id="theimage" src="images/p1-340-thumb.jpg" /> 

myImage = $('#theimage'); 
colorThief = new ColorThief(); 
color = colorThief.getColor(myImage[0]); 
red = color[0]; 
green = color[1]; 
blue = color[2];

स्रोत

2013-10-07 21:37:50 bmerigan

अच्छी पकड़। jQuery लिपटे सेट उनके अंतर्निहित डीओएम तत्व नहीं हैं, और कई पुस्तकालयों के लिए आपको एक डोम तत्व पास करने की आवश्यकता होती है। इसने मुझे कई बार काट दिया है। :) http://stackoverflow.com/questions/1677880/how-to-get-a-dom-element-from-a-jquery- चयनकर्ता – Palpatim

मैं एक ही समस्या थी गया है, और यह इस तरह से हल:

// get my image url 
var imageUrl = '//myimage.ulr.com'; 
// than create an image elm, the sizes are needed. 360x360 on this case 
var image = new Image(360, 360); 


image.onload = function(){ 
    // act only after image load 
    console.log(image); 

    // than colorThief and get the color value 
    var colorThief = new ColorThief();   
    var color = colorThief.getColor(image); 
    console.log(color); 
}; 
image.src = imageUrl;

आशा है कि यह मदद करता है किसी भी

स्रोत

2016-08-13 00:06:16 diegofelipece

मैं इसे काम करने के लिए नहीं मिल सकता ... मैं आखिरकार खींचने की कोशिश कर रहा हूं किसी तत्व की पृष्ठभूमि छवि में, लेकिन यह आपके उदाहरण के लिए इसे सरल बना रहा है, यूआरएल स्पष्ट रूप से परिभाषित किया गया है ... मुझे अभी भी कुछ भी नहीं मिला है। कोई विचार क्यों? http://codepen.io/chasebank/pen/xEAAWE – Chase

रंग चोर काम नहीं करेगा ...

उत्तर

संबंधित मुद्दे