Introduction to HTML with Canvas for TM1

WHAT IS HTML ?

HTML is a markup language used to describe the format of pages in a website. Behind every website, like this blog, you'll find HTML. If you want to learn it, there are lots of websites which explain the basics of HTML. A good starting point is w3schools. Learning HTML will provide you with a skill that will always be in fashion, the internet is not going to disappear anytime in the near future!!

Understanding HTML is one thing but if you want to add TM1 information to your web pages, it is easier said than done.

HTML AND TM1 REST API

Since version 10.2, IBM has released the TM1 REST API which is a new mechanism to access and to manage your TM1 application. The TM1 REST API is a very powerful way of accessing TM1, it is relatively easy to get information from TM1, especially compared to the old TM1 APIs. It is however designed to be a low-level mechanism for accessing TM1 which means you can do a lot of things with TM1 but some things that could be simple are hard to do. 

To bridge the gap between the low-level TM1 REST API and HTML, Cubewise created Canvas. Canvas is a web framework which enables you to focus on the HTML while Canvas deals with the complexities of the TM1 REST API.

You do not need to know HTML nor the REST API to start using Canvas. There are some pre-built examples which will show you how to extract information using functions that anyone familiar with TM1 would know, like DBR, DBRA, SUBNM, etc...

If you know how to write a rule or a TI, you will quickly learn how to use HTML with TM1.

CANVAS EXAMPLES:

DBR:

<tm1-ui-dbr 
    tm1-instance="dev" 
    tm1-cube="Regional Assumptions"
    tm1-elements="Actual,2012,Jan,13,Super Rate" >
</tm1-ui-dbr>

DBR (%):

<tm1-ui-dbr 
  tm1-instance="dev" 
  tm1-cube="Regional Assumptions" 
  tm1-elements="Actual,2012,Jan,13,Super Rate" 
  tm1-format-percentage="true">
</tm1-ui-dbr>

DBRA

<tm1-ui-dbra     
  tm1-instance="dev" 
  tm1-dimension="Account" 
  tm1-element="1110"
  tm1-attribute="Account Type">
</tm1-ui-dbra>

DBRA (READ ONLY)

<tm1-ui-dbra 
  tm1-instance="dev" 
  tm1-dimension="Account" 
  tm1-element="1110" 
  tm1-attribute="Account Type" 
  tm1-read-only="true">
</tm1-ui-dbra>

SUBNM (HIERARCHY):

<tm1-ui-subnm 
   tm1-instance="dev" 
   tm1-dimension="Account" 
   tm1-subset="Net Income" 
   ng-model="page.Selected2">
</tm1-ui-subnm>

SUBNM (RADIO BUTTON):

<tm1-ui-subnm 
  tm1-instance="dev" 
  tm1-dimension="Currency" 
  tm1-subset="Default" 
  tm1-radio-only="horizontal" 
  ng-model="page.Selected6">
</tm1-ui-subnm>

As you can see TM1 functions in HTML are very similar to TM1 functions in Excel.