Skip to Content

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

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:

Add comment
10|10000 characters needed characters exceeded

  • Get RSS Feed

2 Answers

  • Jan 25 at 09:00 AM

    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

    Add comment
    10|10000 characters needed characters exceeded

  • Dec 18, 2018 at 02:00 PM

    Hi Yogesh

    did you slove the problem about add Text to the Shapes?

    Thanks in advance

    Rene

    Add comment
    10|10000 characters needed characters exceeded