Storing images in Document Properties

This approach requires to convert your image into a data uri and apply such into a background-image css style 


  1. Convert your image into a data using this tool
  2. Store the data:uri as a Document property. If you don't wnat to convert any image, try this one

    data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAIAAACQkWg2AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAMBSURBVDhPHVJJTFNRFP0fZBBiMBE1hJ0LYwCNBZWkLKohQCIqxo0sWGlpy9QCWiJgQmIEhw0IJopCEDG0v22KpBTK8JVJhpahgBCm0gLFQKEtBaTt/++9+mpyFyfvnZNzh0NAxEAEAAQAgdVd15chU1bDaGKVjvuSzqwfbhi2mGyHELEIshBBhCCBqRDCvwz7rm/lXJGKFMgDs1uDRNQJEYVxAF8eWaiu7lo49HgRAgghAmuPPYy4ZTxEJA8WUnfr+huGTGNru3rzbtPQ2v33g6G58hCBQvRt9NDjN/E7VHXNBwqpM4XqnrkthgWAZb37LrfLBVgvC2DfwuZpSVuAoLVMNY0/id9Wx1mJ6mSeSj5uwWLbjHGy9HlvWjqdmq6XljqnjQgCzczWabEyokAxv+Uk3uoWSL4i6/MvL8PuryzpbqZqYjlaDleTcF0Tw+nkJdvn5twAiJr1pEDxQjNLZNQOBAkprdEKEDsulnTEcAxFxUfW9aPNzYmScm0cZyRbCCFQGiwBQirpVR/BrewNz1dMre8CyHRxb3Ve4zqWlv5vDrjMZh2X18NLxXuf3nCE56uipW0Et6o3NFdhMNvxJbqTU7TxiTvjI/guXojsszOdN5LolNtYYDDbwvKUF55picyPw9irZWwdCxYq37THJtDpDza7u619Pf33HrbHXdWXV+C5Pw2YSKE8vYYmGofNpEDGe03bj93uffuoMF9zOb7jUvz32CsdeIDHfPf29pGbSaumSb6scchE/HEeXSzrCBTKK9RTuHOP07EqkxkkxfpCqemrzOtw4lxUdc4HCZTRUo3VfkiwkMFrjpCog3NU4paJnYNjFnhZlgEsw0BoO3CXUJPBOdSpfKVycgPfEQsArqZB0/liJSmgop60PWrW19LLtfRiTrMh6qkaP0aK1fX9JuyPI0jgAOLC0LjhyKgbCCtQkdlyko9LRvBbcQLu1PyYsOwByOLk+Xw+LAB+iADu1e1ljOt7H34uS5XGUpWxnl6c2nAcMzhzfo7Pz/f9A/U2EHZ65ITbAAAAAElFTkSuQmCC
  3. Add the placeholder markup: 

    <div id=yourImage>&nbsp;</div>
      <DIV style="DISPLAY: none" id=imageData><SpotfireControl id="b5ef6b77cddc482c856ccd00124a9305" /></DIV>
       
    1. Add the Javascript to render the image from document propertydata = $("#imageData").text();$("#yourImage").css({"background-image":"url("+data+")","background-repeat":"no-repeat"})



      Check out this other way: http://tibcoanalytics.com/spotfire/archive/totw/2011-09-12.html

      No comments: