How to change the color of series(grouped column chart) only with json object(without js function) on Highchart?

Question

I actually work with a tool named Jedox that allow me to use the Highchart.js library to make chart. So I try to make a simple chart with 2 series and 4 columns it's a grouped column chart(clustered bar chart). I saw on Highchart that is possible to change the color of a series with the array "colors" but when I use it it didn't work. Why ? I also try to use colorByPoint, it's working but it's not what I want because It color catogeries but in the categories there is different series and I want that each series have a precise color. How can I do that ?

Before you see the code here's some precision: I put "undefined" on color attribute because there is no way to delete those attribute so I put them into a default value. Normally when the value is set to "undefined" the color correspond to one of the color in the "colors" array.

One important thing you have to know before help me : I can't use JS, I can only use JSON that's all.

Here's my code:(it's just a json)

"chart": {
    "type": "column",
    "zoomType": "xy",
    "borderRadius": 0,
    "events": {},
    "height": 300,
    "width": 400,
    "backgroundColor": "#FFFFFF",
    "borderWidth": 1,
    "borderColor": "#D8D8D8",
    "plotBackgroundColor": null,
    "plotBorderWidth": 0,
    "plotBorderColor": "#000100",
    "spacingTop": 20
  },
  "plotOptions": {
    "series": {
      "minPointLength": 1,
      "dataLabels": {
        "enabled": false,
        "inside": false,
        "rotation": 0,
        "x": 0,
        "y": 0,
        "style": {
          "fontFamily": "Arial",
          "fontSize": 9,
          "color": "#366092",
          "fontWeight": "normal",
          "fontStyle": "regular"
        }
      },
      "cursor": null,
      "point": {
        "events": {}
      }
    }
  },
  "legend": {
    "symbolRadius": 0,
    "backgroundColor": null,
    "borderWidth": 0,
    "borderColor": "#000100",
    "itemStyle": {
      "fontFamily": "Arial",
      "fontWeight": "normal",
      "fontSize": "11px",
      "color": "#445862",
      "fontStyle": ""
    },
    "floating": false,
    "align": "center",
    "verticalAlign": "bottom",
    "layout": "horizontal",
    "reversed": false
  },
  "title": {
    "text": null
  },
  "series": [
    {
      "name": "Expected",
      "data": [
        1,
        5
      ],
      "color": "undefined",
      "id": 0,
      "property": "dcColumnClustered",
      "type": "column",
      "yAxis": 0,
      "zIndex": 2,
      "borderWidth": 0,
      "dataLabels": {
        "enabled": false
      }
    },
    {
      "name": "Current",
      "data": [
        2,
        3
      ],
      "color": "undefined",
      "id": 1,
      "property": "dcColumnClustered",
      "type": "column",
      "yAxis": 0,
      "zIndex": 2,
      "borderWidth": 0,
      "dataLabels": {
        "enabled": false
      }
    }
  ],
  "xAxis": [
    {
      "id": "x_0",
      "axtype": "xAxis",
      "labels": {
        "enabled": true,
        "style": {
          "fontFamily": "Arial",
          "fontWeight": "normal",
          "fontSize": "11px",
          "color": "#445862",
          "fontStyle": ""
        },
        "autoRotation": false
      },
      "categories": [
        "col1",
        "col2"
      ],
      "title": {
        "style": {
          "fontFamily": "Arial",
          "fontWeight": "normal",
          "fontSize": "11px",
          "color": "#445862",
          "fontStyle": ""
        },
        "text": ""
      },
      "tickInterval": null,
      "minorTickInterval": null,
      "gridLineWidth": 0,
      "minorGridLineWidth": 0,
      "reversed": false,
      "reversedStacks": false
    }
  ],
  "yAxis": [
    {
      "id": "y_0",
      "axtype": "yAxis",
      "opposite": false,
      "labels": {
        "enabled": true,
        "style": {
          "fontFamily": "Arial",
          "fontWeight": "normal",
          "fontSize": "11px",
          "color": "#445862",
          "fontStyle": ""
        },
        "autoRotation": false
      },
      "gridLineWidth": 1,
      "gridLineColor": "#D8D8D8",
      "title": {
        "text": "",
        "style": {
          "fontFamily": "Arial",
          "fontWeight": "normal",
          "fontSize": "11px",
          "color": "#445862",
          "fontStyle": ""
        }
      },
      "tickInterval": null,
      "minorTickInterval": null,
      "reversed": false,
      "reversedStacks": true
    }
  ],
  "tooltip": {
    "enabled": true
  },
  "colors": [
    "#FF0000",
    "#0000FF"
  ]

Here's my Fiddle Here's the goal I want to reach

Answer 1

The default color value is undefined, not a string "undefined". (If undefined value isn't allowed by Jedox, put null instead)

    "series": [{
            "color": undefined,
            ...
        },
        {
            "color": undefined,
            ...
        }
    ]

---

Live demo: https://jsfiddle.net/BlackLabel/zocj5a0b/

API Reference: https://api.highcharts.com/highcharts/series.column.color