How to remove text from the inner circle of a donut chart?

[Former Member]

Dear all,

I created a donut chart. However, the text is always displayed in the inner circle of the donut chart, the text is actaully the measure name:

Now I want to remove the text from the donut chart's inner circle, does anybody know how to archieve this?

Below are my dount.view.js and donut.controller.js

sap.ui.jsview("donut", {

     getControllerName : function() {

          return "donut";

       },

     createContent : function(oController) {

          oController.donutChart = new sap.viz.ui5.Donut(this.createId("Donut"), {

               width: "100%",

               height: "500px"

          });

     return oController.donutChart;

     }

});

sap.ui.controller("donut", {

     onInit: function() {

          this.oModel = new sap.ui.model.json.JSONModel({

               businessData: [

                    {Country: "Canada",Revenue:410.87,profit:-141.25, population:34789000},

                    {Country: "China",Revenue:338.29,profit:133.82, population:1339724852},

                    {Country: "France",Revenue:487.66,profit:348.76, population:65350000},

                    {Country: "Germany",Revenue:470.23,profit:217.29, population:81799600},

                    {Country: "India",Revenue:170.93,profit:117.00, population:1210193422},

                    {Country: "United States",Revenue:905.08,profit:609.16, population:313490000}

               ]

          });

          this.oDataset = new sap.viz.ui5.data.FlattenedDataset({

               dimensions: [{

                    axis: 1,

                    name: "Country",

                    value: "{Country}"

               }],

               measures: [{

                    name: "Revenue",

                    value: "{Revenue}"

               }],

               data: {

                    path: "/businessData"

               }

          });

          this.donutChart.setModel(this.oModel);

          this.donutChart.setDataset(this.oDataset);

     }

});

Any reply will be appreciated!

Thanks and best regards,

Tim

[Former Member · Accepted solution]

Hi Tim,

Add $(.v-donut-title).hide() in your css field

Native style:

  

Result:

[Former Member · Accepted solution]

Hi Pradeep,

Thank you so much for your quick reply, it works!

Best regards,

Tim

[Former Member · Accepted solution]

Hi Tim,

      Its Pleasure

Regards,

Pradeep