Question

我使用highcharts创建气泡图。我将x，y和z坐标作为数据传递。它显示不同半径的圆，底部有单个图例条目。我需要泡泡图中个别圆圈的图例，所以我为个别泡泡创建了不同的系列。我有不同的传说，但圆圈的大小是相同的。请参阅下面的代码。请告诉我这有什么问题。提前致谢




    $.each(input,function(index,value) {        
        red = Math.floor(Math.random() * 255);
        blue = Math.floor(Math.random() * 255);
        green = Math.floor(Math.random() * 255);    
        color = red  + ',' + green + ',' + blue;
        chartData .push({
            name : value.departmentName,                
            marker: {
                symbol:'circle',
                fillColor:{
                        radialGradient: { cx: 0.5, cy: 0.3, r: 0.7 },
                        stops: [[0, 'rgba(255,255,255,0.5)'],[1, Highcharts.Color('rgba(' + color+ ',0.5)').brighten(-0.3).get('rgb')]]},

                lineColor:'rgba(' + color + ',.75)',
                lineWidth:1,           
                states:{
                    hover:{
                        enabled:false
                    }
                }
            },
            data: [{x:value.year, y:value.numberOfUsers, name: value.departmentName, marker: {radius:value.passcount,
                fillColor:{
                    radialGradient: { cx: 0.5, cy: 0.3, r: 0.7 },
                    stops: [[0, 'rgba(255,255,255,0.5)'],[1, Highcharts.Color('rgba(' + color+ ',0.5)').brighten(-0.3).get('rgb')]]}}, z : value.passcount}]
           });      

        });
        return chartData;

    

    ...

    


     function drawChart (chartData){
            //High charts
            var chart = new Highcharts.Chart({
                chart: {
                    renderTo:'container',                       
                    type: 'bubble',
                    plotBorderWidth: 1 ,
                    zoomType: 'xy'
                },
                title:{
                    text:''
                },
                exporting:{
                    enabled : false
                },
               credits: {
                enabled: false
               },
                plotOptions: {
                    series: {
                        shadow:false,
                    }           
                },
                xAxis:{
                    minPadding:.075,
                    maxPadding:.075,
                    lineColor:'#999',
                    lineWidth:1,
                    tickColor:'#666',
                    tickLength:3,
                    title:{
                        text:'My chart'
                    }
                },
                yAxis:{
                    lineColor:'#999',
                    lineWidth:1,
                    tickColor:'#666',
                    tickWidth:1,
                    tickLength:3,
                    gridLineColor:'#ddd',
                    title:{
                        text:'Number Of Users',
                        rotation:270,
                        margin:10,
                    }
                },
                series: chartData

            });

The output for above code is as below

Answer 1

如您所知，Highcharts Bubbles尚未正式发布。但是，在最新的开发代码中，气泡大小是跨系列调整的，因此您可能只是加载了一些旧代码。尝试从http://github.highcharts.com/rambera/highcharts.js和http://github.highcharts.com/rambera/highcharts-more.js运行Highcharts。

Highcharts气泡图与多个系列

1 个答案: