image-to-data.html

<input type="file" id="imageUpload" onchange="previewImage()">
<div id="imagePreview"></div>
<script type="text/javascript">
function previewImage() {
  var preview = document.getElementById('imagePreview');
  img = document.getElementById('imageUpload').files[0];
  var reader  = new FileReader();
  if (img) {
    reader.readAsDataURL(img);
  } else {
    // preview.innerHTML = "";
  }
  reader.onloadend = function(){
    preview.innerHTML = reader.result;
  }
}
</script>
<style type="text/css">
#imagePreview{
  width: 400px;
  height: 200px;
  overflow: auto;
  word-break: break-all;
  border: 1px solid;
  padding: 5px;
  margin: 5px 0px;
  font-family: Arial;
}
</style>