How to display text inside the shape of SAP Fiori Gantt Chart

[yogeshgupta]

Hi All,

I’ve created a Gantt chart taking a reference through explored (sap.gantt).

I need to show data in the calendar on basis of dates coming from backend.

Right now it is showing the rectangle shape with color.

Has anyone worked on such requirement?

Below is the screenshot of what I’m looking to achieve.

Currently my Gantt chart is appearing like this:

Need to add values in the calendar as per below excel:

Expected outcome:

[former_member369026]

Define your Text Shape

var oText= new sap.gantt.config.Shape({
   key: "text",
   shapeClassName: "sap.gantt.shape.Text",
   shapeDataName: "text",
   level: 1,
   shapeProperties: {
      time: "{startTime}",
      text: "{text}",
      textAnchor: "start",
      fill:"green",
      fontSize:12,
      fontFamily:"Arial",
   }});

and add it to your other shapes

aShapes = [oTopShape, oOrderShape, oDiamondConfig, oTriangleConfig, oRelShape, oCalendarConfig, oText];

then add "text" data to your data.json

{
  "id": "0104",
  "level": "01",
  "name": "Define High Level Product Structure",
  "order": [
    {
      "startTime": "20150108000000",
      "endTime": "20150113000000",
      "level": "2"}
  ],
  "text": [
  {
    "startTime": "20150108000000",
    "text": "text"}]

},

Best Regards,

Arnd