Stacked bar chart in any chart

0
Hi Reader,   I am using any chart widget. In this I have used vertical bar chart. I want a json input for stacked bar chart. Can any one provide me a json structure for stacked bar chart in any chart widget?
asked
2 answers
0

Here is a nice video to watch: https://youtu.be/SMzYrc9h6ZQ

 

This is my JSON that you see above filled in:

[
    {
        "x": [
            4.1,
            1.2
        ],
        "y": [
            "Mendix",
            "DemoName"
        ],
        "type": "bar",
        "barmode": "stack",
        "orientation": "h",
        "texttemplate": "%{y}",
        "textposition": "auto",
        "automargin": true,
        "hoverinfo": "all",
        "name": "Trace 1",
        "marker": "{color: '#88C'}"
    }
]

 

My Export Mapping:

 

My MF that creates the skeleton:

 

And the sub-microflow:

 

Go make it

answered
0

Hi Harshraj,

 

I create this graph. 

This is the JSON:

[
  {
    "x": [
      3.5,
      3.5,
      3.5,
      2.5,
      3.5,
      3.5,
      2.5,
      4.5,
      3.5,
      3,
      3.5,
      4.1,
      2.5,
      3.5,
      3.5,
      4,
      2.5,
      4,
      3.5
    ],
    "y": [
      "Microsoft  ",
      "AuraQuantic (formerly AuraPortal)  ",
      "AgilePoint  ",
      "Creatio  ",
      "Salesforce  ",
      "Zoho  ",
      "Oracle (Visual Builder)  ",
      "Quick Base  ",
      "Appian  ",
      "ProntoForms  ",
      "ServiceNow  ",
      "Betty Blocks  ",
      "Oracle (APEX)  ",
      "Pega  ",
      "OutSystems  ",
      "Mendix  ",
      "Newgen  ",
      "Kintone  ",
      "TrackVia  "
    ],
    "type": "bar",
    "orientation": "h",
    "texttemplate": "%{x}",
    "textposition": "auto",
    "automargin": true,
    "hoverinfo": "label",
    "name": "Intuitive, No-Code App Development"
  },
  {
    "x": [
      3,
      2.5,
      3.5,
      2,
      3.5,
      3.3,
      2.5,
      2.5,
      3.8,
      2.5,
      3,
      3,
      2,
      3.5,
      4,
      4.5,
      2.5,
      3,
      2
    ],
    "y": [
      "Microsoft  ",
      "AuraQuantic (formerly AuraPortal)  ",
      "AgilePoint  ",
      "Creatio  ",
      "Salesforce  ",
      "Zoho  ",
      "Oracle (Visual Builder)  ",
      "Quick Base  ",
      "Appian  ",
      "ProntoForms  ",
      "ServiceNow  ",
      "Betty Blocks  ",
      "Oracle (APEX)  ",
      "Pega  ",
      "OutSystems  ",
      "Mendix  ",
      "Newgen  ",
      "Kintone  ",
      "TrackVia  "
    ],
    "type": "bar",
    "orientation": "h",
    "texttemplate": "%{x}",
    "textposition": "auto",
    "automargin": true,
    "hoverinfo": "label",
    "name": "Application User Experience"
  },
  {
    "x": [
      3.3,
      3.5,
      4,
      2.8,
      3,
      3.3,
      3,
      2.5,
      3.8,
      2,
      3.5,
      3.5,
      3.5,
      3.8,
      4,
      4,
      3.3,
      2,
      2.5
    ],
    "y": [
      "Microsoft  ",
      "AuraQuantic (formerly AuraPortal)  ",
      "AgilePoint  ",
      "Creatio  ",
      "Salesforce  ",
      "Zoho  ",
      "Oracle (Visual Builder)  ",
      "Quick Base  ",
      "Appian  ",
      "ProntoForms  ",
      "ServiceNow  ",
      "Betty Blocks  ",
      "Oracle (APEX)  ",
      "Pega  ",
      "OutSystems  ",
      "Mendix  ",
      "Newgen  ",
      "Kintone  ",
      "TrackVia  "
    ],
    "type": "bar",
    "orientation": "h",
    "texttemplate": "%{x}",
    "textposition": "auto",
    "automargin": true,
    "hoverinfo": "label",
    "name": "Data Model and Management"
  },
  {
    "x": [
      3,
      4,
      4,
      3,
      3.5,
      3.3,
      1.5,
      2.5,
      4.5,
      2,
      3.1,
      2.5,
      1.5,
      4.5,
      3.5,
      4,
      4,
      2,
      3
    ],
    "y": [
      "Microsoft  ",
      "AuraQuantic (formerly AuraPortal)  ",
      "AgilePoint  ",
      "Creatio  ",
      "Salesforce  ",
      "Zoho  ",
      "Oracle (Visual Builder)  ",
      "Quick Base  ",
      "Appian  ",
      "ProntoForms  ",
      "ServiceNow  ",
      "Betty Blocks  ",
      "Oracle (APEX)  ",
      "Pega  ",
      "OutSystems  ",
      "Mendix  ",
      "Newgen  ",
      "Kintone  ",
      "TrackVia  "
    ],
    "type": "bar",
    "orientation": "h",
    "texttemplate": "%{x}",
    "textposition": "auto",
    "automargin": true,
    "hoverinfo": "label",
    "name": "Process and Business Logic"
  },
  {
    "x": [
      3.5,
      2.8,
      2.8,
      3.5,
      4.5,
      3.9,
      1.5,
      3,
      3.3,
      1.5,
      4,
      3.5,
      3.5,
      3.5,
      4,
      3.5,
      2,
      4,
      1
    ],
    "y": [
      "Microsoft  ",
      "AuraQuantic (formerly AuraPortal)  ",
      "AgilePoint  ",
      "Creatio  ",
      "Salesforce  ",
      "Zoho  ",
      "Oracle (Visual Builder)  ",
      "Quick Base  ",
      "Appian  ",
      "ProntoForms  ",
      "ServiceNow  ",
      "Betty Blocks  ",
      "Oracle (APEX)  ",
      "Pega  ",
      "OutSystems  ",
      "Mendix  ",
      "Newgen  ",
      "Kintone  ",
      "TrackVia  "
    ],
    "type": "bar",
    "orientation": "h",
    "texttemplate": "%{x}",
    "textposition": "auto",
    "automargin": true,
    "hoverinfo": "label",
    "name": "Platform Ecosystem"
  },
  {
    "x": [
      4,
      3.3,
      3.5,
      2.5,
      2,
      3.5,
      3,
      3.5,
      4,
      2,
      3.5,
      3.8,
      1.5,
      4,
      3.5,
      4,
      3,
      2,
      3
    ],
    "y": [
      "Microsoft  ",
      "AuraQuantic (formerly AuraPortal)  ",
      "AgilePoint  ",
      "Creatio  ",
      "Salesforce  ",
      "Zoho  ",
      "Oracle (Visual Builder)  ",
      "Quick Base  ",
      "Appian  ",
      "ProntoForms  ",
      "ServiceNow  ",
      "Betty Blocks  ",
      "Oracle (APEX)  ",
      "Pega  ",
      "OutSystems  ",
      "Mendix  ",
      "Newgen  ",
      "Kintone  ",
      "TrackVia  "
    ],
    "type": "bar",
    "orientation": "h",
    "texttemplate": "%{x}",
    "textposition": "auto",
    "automargin": true,
    "hoverinfo": "label",
    "name": "API and Integration"
  },
  {
    "x": [
      3,
      2.5,
      1.5,
      2,
      3.5,
      6.5,
      2.5,
      3,
      4.3,
      1.5,
      3.5,
      3.5,
      2,
      4.5,
      4,
      4,
      2.8,
      1.5,
      1.5
    ],
    "y": [
      "Microsoft  ",
      "AuraQuantic (formerly AuraPortal)  ",
      "AgilePoint  ",
      "Creatio  ",
      "Salesforce  ",
      "Zoho  ",
      "Oracle (Visual Builder)  ",
      "Quick Base  ",
      "Appian  ",
      "ProntoForms  ",
      "ServiceNow  ",
      "Betty Blocks  ",
      "Oracle (APEX)  ",
      "Pega  ",
      "OutSystems  ",
      "Mendix  ",
      "Newgen  ",
      "Kintone  ",
      "TrackVia  "
    ],
    "type": "bar",
    "orientation": "h",
    "texttemplate": "%{x}",
    "textposition": "auto",
    "automargin": true,
    "hoverinfo": "label",
    "name": "Architecture"
  },
  {
    "x": [
      3.5,
      2.5,
      2.9,
      2.5,
      4,
      3.7,
      3,
      3,
      3.5,
      2,
      3.8,
      3,
      3.5,
      3.5,
      4,
      4.5,
      3,
      2.5,
      2.5
    ],
    "y": [
      "Microsoft  ",
      "AuraQuantic (formerly AuraPortal)  ",
      "AgilePoint  ",
      "Creatio  ",
      "Salesforce  ",
      "Zoho  ",
      "Oracle (Visual Builder)  ",
      "Quick Base  ",
      "Appian  ",
      "ProntoForms  ",
      "ServiceNow  ",
      "Betty Blocks  ",
      "Oracle (APEX)  ",
      "Pega  ",
      "OutSystems  ",
      "Mendix  ",
      "Newgen  ",
      "Kintone  ",
      "TrackVia  "
    ],
    "type": "bar",
    "orientation": "h",
    "texttemplate": "%{x}",
    "textposition": "auto",
    "automargin": true,
    "hoverinfo": "label",
    "name": "Quality of Service"
  },
  {
    "x": [
      3.5,
      3.1,
      3,
      3,
      3,
      3,
      3,
      2,
      4,
      1.5,
      3.5,
      3.3,
      2.5,
      4,
      4,
      4,
      2.5,
      1.5,
      1.5
    ],
    "y": [
      "Microsoft  ",
      "AuraQuantic (formerly AuraPortal)  ",
      "AgilePoint  ",
      "Creatio  ",
      "Salesforce  ",
      "Zoho  ",
      "Oracle (Visual Builder)  ",
      "Quick Base  ",
      "Appian  ",
      "ProntoForms  ",
      "ServiceNow  ",
      "Betty Blocks  ",
      "Oracle (APEX)  ",
      "Pega  ",
      "OutSystems  ",
      "Mendix  ",
      "Newgen  ",
      "Kintone  ",
      "TrackVia  "
    ],
    "type": "bar",
    "orientation": "h",
    "texttemplate": "%{x}",
    "textposition": "auto",
    "automargin": true,
    "hoverinfo": "label",
    "name": "Persona and SDLC"
  },
  {
    "x": [
      3.5,
      2,
      3.3,
      2,
      4,
      3,
      2.5,
      4,
      4.3,
      2.5,
      3,
      2.5,
      2,
      4,
      3.5,
      3.5,
      2.5,
      2.5,
      2
    ],
    "y": [
      "Microsoft  ",
      "AuraQuantic (formerly AuraPortal)  ",
      "AgilePoint  ",
      "Creatio  ",
      "Salesforce  ",
      "Zoho  ",
      "Oracle (Visual Builder)  ",
      "Quick Base  ",
      "Appian  ",
      "ProntoForms  ",
      "ServiceNow  ",
      "Betty Blocks  ",
      "Oracle (APEX)  ",
      "Pega  ",
      "OutSystems  ",
      "Mendix  ",
      "Newgen  ",
      "Kintone  ",
      "TrackVia  "
    ],
    "type": "bar",
    "orientation": "h",
    "texttemplate": "%{x}",
    "textposition": "auto",
    "automargin": true,
    "hoverinfo": "label",
    "name": "Governance"
  },
  {
    "x": [
      3.5,
      3.5,
      3.4,
      2,
      4,
      2.9,
      2.5,
      3.5,
      4,
      1.5,
      3,
      2,
      3.5,
      3.8,
      3.5,
      3.5,
      3,
      2.5,
      2.5
    ],
    "y": [
      "Microsoft  ",
      "AuraQuantic (formerly AuraPortal)  ",
      "AgilePoint  ",
      "Creatio  ",
      "Salesforce  ",
      "Zoho  ",
      "Oracle (Visual Builder)  ",
      "Quick Base  ",
      "Appian  ",
      "ProntoForms  ",
      "ServiceNow  ",
      "Betty Blocks  ",
      "Oracle (APEX)  ",
      "Pega  ",
      "OutSystems  ",
      "Mendix  ",
      "Newgen  ",
      "Kintone  ",
      "TrackVia  "
    ],
    "type": "bar",
    "orientation": "h",
    "texttemplate": "%{x}",
    "textposition": "auto",
    "automargin": true,
    "hoverinfo": "label",
    "name": "Security and Compliance"
  }
]
 

If you need more, let me know.

 

Go make it

answered