Chart renders in 2 different layouts (random)
jszuminski opened this issue · comments
Jakub Szumiński commented
Description
A JSON config passed to the Export Server (on the currently deployed version) renders the same chart in 2 different layouts (seems to be random).
Images
Reproduction
Paste the following config on the https://export.highcharts.com to generate two different results:
{
"xAxis": [
{
"plotBands": [
{
"from": 1701734400000.0,
"to": 1705017600000.0,
"zIndex": 2.0,
"id": "b74d2fa1-2095-45ab-bc9c-756d690752b4",
"color": "#d1e7dd"
},
{
"from": 1705104000000.0,
"to": 1708041600000.0,
"zIndex": 2.0,
"id": "c671a233-154f-4038-8971-6bf3acf81e12",
"color": "#d1e7dd"
}
],
"plotLines": [
{
"value": 1708041600000.0,
"zIndex": 3.0,
"dashStyle": "dash",
"id": "c671a233-154f-4038-8971-6bf3acf81e12",
"color": "Black"
},
{
"value": 1705017600000.0,
"zIndex": 3.0,
"dashStyle": "dash",
"id": "b74d2fa1-2095-45ab-bc9c-756d690752b4",
"color": "Black"
},
{
"id": "Diagnose",
"dashStyle": "dashDot",
"color": "Red",
"value": 1702425600000.0,
"zIndex": 3.0,
"label": {
"text": "Diagnose"
}
},
{
"id": "Debut",
"dashStyle": "dashDot",
"color": "Red",
"value": 1697068800000.0,
"zIndex": 3.0,
"label": {
"text": "Debut"
}
}
],
"min": 1696809600000.0,
"height": "50%",
"max": 1712613600000.0,
"title": {
"enabled": true
},
"top": "50%",
"type": "datetime"
}
],
"chart": {
"height": 378.0,
"animation": false,
"spacingLeft": -35.0,
"zoomType": "x"
},
"yAxis": [
{
"id": "EDSS",
"min": 0.0,
"gridZIndex": 3.0,
"tickAmount": 11.0,
"zIndex": 4.0,
"max": 10.0,
"title": {
"text": "Funksjonsskår (EDSS)"
},
"top": "50%",
"height": "50%",
"showFirstLabel": false
},
{
"id": "Attakker",
"min": 1.0,
"labels": {
"enabled": false
},
"height": "10%",
"zIndex": 4.0,
"max": 1.0,
"tickColor": "none",
"title": {
"offset": 0.0,
"enabled": false,
"text": "Attakker/MR/NAB/JCV",
"rotation": 0.0
},
"top": "90%"
},
{
"id": "Behandlinger",
"min": 0.0,
"labels": {
"enabled": false
},
"height": "30%",
"zIndex": 4.0,
"max": 3.0,
"title": {
"offset": -20.0,
"rotation": 0.0,
"text": "Behandlinger"
},
"top": "20%"
},
{
"id": "Bivirkninger",
"min": 0.0,
"labels": {
"enabled": false
},
"height": "20%",
"zIndex": 4.0,
"max": 4.0,
"title": {
"offset": -80.0,
"rotation": 0.0,
"text": "Bivirkninger"
}
}
],
"subtitle": {
"text": null,
"x": -20.0
},
"ReportChartType": 0,
"title": {
"text": null,
"x": -20.0
},
"colors": [
"#003087",
"#6CACE4",
"#BFCED6",
"#6FA287",
"#ADDFB3",
"#00C19F",
"#93C90E",
"#FFC845",
"#FF671F",
"#A76E5E",
"#CB333B",
"#87189D"
],
"credits": {
"enabled": false
},
"series": [
{
"color": "Black",
"data": [
{
"x": 1704844800000.0,
"y": 4.0
},
{
"x": 1705017600000.0,
"y": 4.0
},
{
"x": 1705104000000.0,
"y": 2.0
},
{
"x": 1707696000000.0,
"y": 9.0
},
{
"x": 1708041600000.0,
"y": 9.0
},
{
"x": 1708387200000.0,
"y": 5.0
}
],
"tooltip": {
"xDateFormat": "%d.%m.%Y"
},
"animation": false,
"type": "line",
"name": "EDSS",
"yAxis": "EDSS"
},
{
"marker": {
"radius": 8.0,
"fillColor": "Red"
},
"color": "none",
"data": [
{
"x": 1704758400000.0,
"y": 1.0
},
{
"x": 1707696000000.0,
"y": 1.0
},
{
"x": 1709683200000.0,
"y": 1.0
}
],
"zIndex": 5.0,
"tooltip": {
"xDateFormat": "%d.%m.%Y",
"pointFormat": "<b>{series.name}</b><br/>"
},
"animation": false,
"type": "line",
"name": "Attakk",
"yAxis": "Attakker"
},
{
"marker": {
"radius": 8.0
},
"color": "DarkRed",
"type": "line",
"name": "NAB",
"zIndex": 5.0,
"tooltip": {
"xDateFormat": "%d.%m.%Y",
"pointFormat": "<b>{series.name}</b><br/>Svar: {point.options.svar}<br/>"
},
"animation": false,
"lineWidth": 0.0,
"yAxis": "Attakker"
},
{
"marker": {
"radius": 8.0
},
"color": "DarkRed",
"type": "line",
"name": "JCV",
"zIndex": 5.0,
"tooltip": {
"xDateFormat": "%d.%m.%Y",
"pointFormat": "<b>{series.name}</b><br/>Svar: {point.options.svar}<br/>JC Indeks: {point.options.index}<br/>"
},
"animation": false,
"lineWidth": 0.0,
"yAxis": "Attakker"
},
{
"marker": {
"radius": 8.0,
"fillColor": "Black"
},
"color": "none",
"data": [
{
"x": 1704672000000.0,
"y": 1.0
},
{
"x": 1707868800000.0,
"y": 1.0
}
],
"tooltip": {
"xDateFormat": "%d.%m.%Y",
"pointFormat": "<b>{series.name}</b><br/>"
},
"animation": false,
"type": "line",
"name": "MR",
"yAxis": "Attakker"
},
{
"animation": false,
"data": [
{
"color": "#cce5ff",
"name": "Extavia",
"dataLabels": {
"enabled": true,
"format": "{point.name}"
},
"x2": 1706745600000.0,
"y": 2.0,
"x": 1706659200000.0
},
{
"color": "#cce5ff",
"name": "Betaferon",
"dataLabels": {
"enabled": true,
"format": "{point.name}"
},
"x2": 1708387200000.0,
"y": 3.0,
"x": 1706745600000.0
},
{
"color": "#cce5ff",
"name": "Betaferon",
"dataLabels": {
"enabled": true,
"format": "{point.name}"
},
"x2": 1708473600000.0,
"y": 3.0,
"x": 1708387200000.0
},
{
"color": "#cce5ff",
"name": "Tecfidera",
"dataLabels": {
"enabled": true,
"format": "{point.name}"
},
"x2": 1708732800000.0,
"y": 1.0,
"x": 1708473600000.0
},
{
"color": "#cce5ff",
"name": "Tecfidera",
"dataLabels": {
"enabled": true,
"format": "{point.name}"
},
"x2": 1708992000000.0,
"y": 1.0,
"x": 1708732800000.0
},
{
"color": "#cce5ff",
"name": "Ocrevus",
"dataLabels": {
"enabled": true,
"format": "{point.name}"
},
"x2": 1709251200000.0,
"y": 1.0,
"x": 1708992000000.0
},
{
"color": "#cce5ff",
"name": "Mavenclad",
"dataLabels": {
"enabled": true,
"format": "{point.name}"
},
"x2": 1709424000000.0,
"y": 2.0,
"x": 1709251200000.0
},
{
"color": "#cce5ff",
"name": "Extavia",
"dataLabels": {
"enabled": true,
"format": "{point.name}"
},
"x2": 1710115200000.0,
"y": 2.0,
"x": 1709424000000.0
}
],
"tooltip": {
"xDateFormat": "%d.%m.%Y",
"pointFormat": "{series.name}: <b>{point.name}</b><br/>"
},
"pointWidth": 20.0,
"type": "xrange",
"name": "Behandlinger",
"yAxis": "Behandlinger"
},
{
"animation": false,
"data": [
{
"description": "MabThera",
"color": "#f8d7da",
"name": "Ingennnn",
"dataLabels": {
"enabled": true,
"allowOverlap": true,
"format": "{point.name}"
},
"x2": 1709251200000.0,
"x": 1706745600000.0,
"y": 3.0
},
{
"description": "Extavia",
"color": "#f8d7da",
"name": "Fatigue",
"dataLabels": {
"enabled": true,
"allowOverlap": true,
"format": "{point.name}"
},
"x2": 1708560000000.0,
"x": 1708387200000.0,
"y": 1.0
}
],
"tooltip": {
"xDateFormat": "%d.%m.%Y",
"pointFormat": "{series.name}: <b>{point.name}</b><br/>Relatert til: <b>{point.description}</b><br/>"
},
"pointWidth": 20.0,
"type": "xrange",
"name": "Bivirkninger",
"yAxis": "Bivirkninger"
}
],
"plotOptions": {
"pie": {
"cursor": "pointer",
"allowPointSelect": true,
"dataLabels": {
"enabled": true,
"format": "<b>{point.name}</b>: {point.y}"
}
},
"bar": {
"pointWidth": 15.0
}
}
}
PawelDalek commented
Most likely fixed by the: #521.