Apptio for All

 View Only
Expand all | Collapse all

HTML + Icons or Images

  • 1.  HTML + Icons or Images

    Posted Wed May 22, 2024 11:13 AM

    Hey folks - Does anyone know if this information on HTML+ Icons is still valid in the latest version?  Do w have any opportunity to work with embedded images or icons in HTML in the reporting surface?

    https://community.apptio.com/blogs/gregory-nutt1/2020/12/09/using-html-to-display-icons 


    #ApptioforAll


  • 2.  RE: HTML + Icons or Images

    Posted Wed May 22, 2024 01:22 PM

    @Stephanie Geltrude, it still works. We use that to for tiles and buttons.  

    Icon
    and this is the HTML code
    <center><img src='/graphics/IconExperience_O/o_collection_png/office/48x48/chart_area.png'><a href="your URL to the report here"target="_blank" style="text-decoration:none;color:#234390">Benchmarking<br><font size=2><i>Your description of the title under the icon here<br></center>


    ------------------------------
    Tony Wong
    ExxonMobil TBM Consultant
    ------------------------------



  • 3.  RE: HTML + Icons or Images

    Posted Thu May 23, 2024 05:01 AM

    We had Apptio Support upload our logo a very long time ago, and it's still there:

    More recently, we have also used the IconExperience o_collection  icons, as described by @Tony Wong below.



    ------------------------------
    Regards, Guillermo
    ------------------------------



  • 4.  RE: HTML + Icons or Images

    Posted Fri May 24, 2024 03:40 AM
    Edited by System Test 3 days ago

    Hi Guillermo,

    Did you know you can also store any picture in a table.

    Convert the bitmap to a BASE64 data  (for instance with Base64 Image Encoder )

    Then past this string into a data set (e.g. Logo MAP) with columns Data and Item like this:

    =====================================================================

    Data@Item

    data:image/png;base64,iVBORw0KGgoAAAABJRU5ErkJggg==@Logo

    =====================================================================

    Use a HTML lookup in the report like this:

    <style>.logo {width:240px;height:80px;background:url('<%={Logo MAP}:Data[Item="Logo"]%>')  no-repeat;}</style><div class="logo"></div>

    and Bob's your uncle.

    Cheers,

    Robert




  • 5.  RE: HTML + Icons or Images

    Posted Fri May 24, 2024 03:52 AM

    That's a great tip, @Robert Brilmayer!! 😎😎😎

    I'll be sure to test it as soon as I get the time, "Uncle Bob" 😊😊😊



    ------------------------------
    Regards, Guillermo
    ------------------------------



  • 6.  RE: HTML + Icons or Images

    Posted Fri May 24, 2024 08:34 AM

    Thanks, Robert. I tried your suggestion and I believe the picture can only be a simple bitmap. I tried using my profile picture and the result looks like this. I think what is showing is the top corner of my picture. 

    Logo


    ------------------------------
    Tony Wong
    ExxonMobil TBM Consultant
    ------------------------------



  • 7.  RE: HTML + Icons or Images

    Posted Fri May 24, 2024 08:44 AM
    Edited by System Test 3 days ago

    Hi Tony,

    Make sure you use @ as seperator in the source table and it looks something like this:

    Result:

    And adjust the size in the HTML code: 

    width:200px;height:200px

    Good luck!




  • 8.  RE: HTML + Icons or Images

    Posted Fri May 24, 2024 12:00 PM

    That's why. Wonderful. Thank you so much for this, Robert.



    ------------------------------
    Tony Wong
    ExxonMobil TBM Consultant
    ------------------------------