Highchart bubble chart with area chart

Question & Answer
,
1

I am trying to build a combination chart of highchart : bubble and 4 area charts.
It only displays one or the other not both(I mean all 5).
How do you join 2 different series : one with map and other without.

Attached is my code below:

“series”: [“map”, [“unique”, [“getColumn”, 1] ], //Unique values from instititution name
{
“type”:“bubble”,
“color”: “#2994C7”,
“yAxis”:0,
“xAxis”:0,
“name”:[“item”],
“data”: [“map”,[“filter”,[“getColumn”, 1,2,3,4],[“==”, [“get”,[“item”],0], [“item”,2] ] ] ,
[ [“get”,[“item”],1],[“get”,[“item”],2], [“get”,[“item”],3] ]]

},
   { // next four series are for color
    "type": "area",
    "yAxis":1,
    "xAxis":1,
    "fillOpacity": 0.4,
    "data": [[-1, -1], [0, -1]]
},
{ // next four series are for color
    "type": "area",
    "yAxis":1,
    "xAxis":1,
    "fillOpacity": 0.4,
    "data": [[-1,1],[0, 1]]
},
    { // next four series are for color
    "type": "area",
    "yAxis":1,
    "xAxis":1,
    "fillOpacity": 0.4,
    "data": [[0, 1],[1, 1]]
},
        { // next four series are for color
    "type": "area",
    "yAxis":1,
    "xAxis":1,
    "fillOpacity": 0.4,
    "data": [[0, -1],[1,-1]]
}

]

2

Hello @adevaraj hope this message finds you well!!

as sugestion, maybe this work for you:

 {
    chart: { type: 'bubble' },
    title: { text: 'Combination Chart' },
    xAxis: [{ gridLineWidth: 1 }],
    yAxis: [
        { title: { text: 'Primary Axis' } },
        { title: { text: 'Secondary Axis' }, opposite: true }
    ],
    series: [
        {
            type: 'bubble',
            color: '#2994C7',
            yAxis: 0,
            xAxis: 0,
            name: 'Bubble Series',
            data: [
                // Replace this array with your processed data
                [9, 81, 63], [98, 5, 89], [51, 50, 73], [41, 22, 14],
                [58, 24, 20], [78, 37, 34], [55, 56, 53], [18, 45, 70],
                [42, 44, 28], [3, 52, 59], [31, 18, 97], [79, 91, 63],
                [93, 23, 23], [44, 83, 22]
            ]
        },
        { type: 'area', yAxis: 1, xAxis: 1, fillOpacity: 0.4, data: [[-1, -1], [0, -1]] },
        { type: 'area', yAxis: 1, xAxis: 1, fillOpacity: 0.4, data: [[-1, 1], [0, 1]] },
        { type: 'area', yAxis: 1, xAxis: 1, fillOpacity: 0.4, data: [[0, 1], [1, 1]] },
        { type: 'area', yAxis: 1, xAxis: 1, fillOpacity: 0.4, data: [[0, -1], [1, -1]] }
    ]
});```


ensure that each series is correctly configured and that the axes are set up to accommodate multiple chart types

I use this as reference: https://www.highcharts.com/docs/chart-and-series-types/bubble-series

tell me if it's work
3

@lary_andr thanks for your response.

I cannot use predetermined values for the bubble chart. Nor can I use a simple data for bubble chart. I need to use the map function for the bubble chart .

Thanks,
Amita

4

Hi @adevaraj,
It’s been awhile since we last heard from you on this thread, were you able to find a work around for your case?

If not, here’s some extra documentation that may be able to assist a bit further:

Let us know if you have any additional questions, if we do not hear back within the next 3 business days, I’ll close out this topic.

Thank you!

5

@Brett ,

The topics you shared are not specific to highcharts in quicksight.
My issue is specific to highcharts in Quicksight.

As I mentioned, I am trying to use data that is present in column for my bubble chart (I need to use max function to get right data labels).

Do you have any article that speaks of combining such a chart with other charts?

Thanks,
Amita

6

Hi @adevaraj,
QuickSight utilizes has incorporated highcharts in to the QuickSight model but there are still limitations to the visual types that can be utilized from highcharts. I linked the highcharts page as that is essentially what QuickSight is utilizing in it’s model (but with limitations).
While bubble charts have been incorporated in to QuickSight, this type of combo chart may not be achievable as of yet.

In regards to documentation, QuickSight does not currently have a large library as it’s still a fairly new feature. I will mark this as a feature request to promote visibility to the support team.

7

Hi @adevaraj,
It’s been a while since we last heard from you on this thread, do you have any additional questions regarding your post?

If we do not hear back within the next 3 business days, I’ll close out this topic.

Thank you!

8

Hi @adevaraj,
Since we have not heard back, I’ll go ahead and close out this topic. However, if you have any additional questions, feel free to create a new post in the community and link this discussion for relevant information if needed.

Thank you!