Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

  1. On the home page of Canvas Studio, click App Designer.



  2. Clickicon to create a new app.



  3. Enter an appropriate name in the App Display Name field, e.g. Area Chart App.
    1. Enter an appropriate ID in the App ID and View ID fields, e.g. AREA_CHART_APP.
    2. In the App Resource Bundle field, enter the name of the bundle key associated with the property file, e.g. common.
    3. Select the appropriate Product, Sub-Product and Function Codes. For detailed information on Product, Sub-Product and Function Codes, refer Configuring Entitlements and Creating Product, Sub-Product and Function Codes.
    Note

    On entering the App ID, the View ID gets filled automatically. However, you can still apply changes to the View ID. No blank spaces and special characters should be used in the App ID and View ID fields. The underscore symbol can be used. During the creation of an app, you can edit the App ID and View ID fields. However, while editing an app, you cannot apply changes to the App ID and View ID fields.




  4. Select the AREA chart view type.
    1. Click the Datasource tab to select the relevant data source for the area chart widget.



  5. Click the Data Src ID field and type the name of the Data Source to select it.

    Note

    You can uncheck the Use Existing Data Source and Use Default instruction Class checkboxes to connect to any data source using SQL Param Map ID. For detailed information on using the SQL Map and the instruction class to display data on the app, refer Adding the SQL Map and Instruction Class with App.

    1. Click Proceed to design the app.



  6. Click Columns tab.



  7. Drag and Drop the ACCOUNT_NAME column to X-Axis.
    1. Drag and Drop the AVAI_BALANCE column to Y-Axis.



  8. Click theicon to use the additional available configurations.



  9. Click Configure to change the column properties. Each column will have the default properties already set.
    1. After applying changes to the column properties, click Apply.



    On clicking Apply, the chart designer area will get displayed, where you can view the temporary preview of the chart.



  10. Clickicon to save the app.



    A confirmation message, indicating a successful save appears.



  11. Click Ok.

    Let's assume that the Area Chart App is mapped to the ACCOUNT SUMMARY workspace. The following screen shot serves as a good illustration of the output in the functional application, Modelhouse: