title: Why is a canvas drawn with an image a slightly different color than the image itself?
body: <p>I am painting an image to a HTML canvas and getting image data from it to find the colors of specific pixels. The image is a map where each country is a different color. I want to cross reference the color returned by .getImageData() to a list of colors I made by hand to find which country any given pixel is in. </p>
  
  <p>My issue is, the image I paint to the canvas and the image that is painted are slightly different colors.</p>
  
  <p>This is the original picture being drawn to the canvas:</p>
  
  <p><img src="https://i.stack.imgur.com/moTRz.png" alt="original picture"></p>
  
  <p>This is the picture I get when I download the canvas as a PNG:</p>
  
  <p><img src="https://i.stack.imgur.com/ET6zS.png" alt="Outcome"></p>
  
  <p>The two look almost identical, but if you download them and open them in a photo editing software, you will find they aren't. For example, the grey ocean in the top picture is 73,73,73,255 and the grey ocean in the bottom picture is 71,71,71,255.</p>
  
  <p>I can still accomplish my goal of determining the country a pixel is in, but I need to make a new list based on the picture I download after it is painted to the canvas.</p>
  
  <p>This just seems like a really weird issue.</p>
  
  <p>If anyone is wondering, my code looks like this:</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;img scr="active_map.png" class="active" id="activeImage"&gt;
  &lt;canvas id="activeCanvas" width="439px" height="245px"&gt;Your Browser Doesn't Support HTML5 Canvases... Sorry :( &lt;/canvas&gt;
  </code></pre>
  
  <p>JS:</p>
  
  <pre><code>var activeCanvas = document.getElementById('activeCanvas')
  var activeContext = activeCanvas.getContext("2d");
  var activeImage = document.getElementById('activeImage')
  activeContext.drawImage(activeImage,0,0);
  var activePixelData = activeContext.getImageData(0,0,439,245)["data"];
  </code></pre>
  
  <p>Also, I am using Firefox 31 for Ubuntu</p>
  
  <p>-Thanks for the help</p>