Highcharts:生成维恩图的最佳实践

时间:2013-05-24 09:00:54

标签: highcharts export venn-diagram

我想创建不同的维恩图,如http://www.biomedcentral.com/1471-2105/12/35/figure/F1并使用Highchart库(因为有一个很好的导出选项)。我发现this example但是当我有4个数据集时我无法制作省略号。我认为它可以在“Maker”级参数中实现。但也许还有另一种解决方案。请你能给我一些线索?

var chart = new Highcharts.Chart({
    chart: {
        renderTo:'container',
        type:'scatter'
    },
    title:{
        text:'Chart Title'
    },
    credits:{enabled:false},
    legend:{},
    plotOptions: {
        series: {
            shadow:false,
            borderWidth:0,
            marker:{
                symbol:'circle'
            }                            
        }
    },
    xAxis:{
        min:0,
        max:10,
        lineWidth:0,
        gridLineWidth:0,
        title:{text:''},
        labels:{enabled:false}
    },
    yAxis:{
        min:0,
        max:100,
        lineWidth:0,
        gridLineWidth:0,
        title:{text:''},
        labels:{enabled:false}
    },    
    series: [{
        color:'rgba(90,155,212,.5)',
        name:'this thing',
        data: [{
            x:3,
            y:50,
            marker:{
                radius:150,
                fillColor:'rgba(90,155,212,.5)',
                lineColor:'rgba(90,155,212,.75)',
                lineWidth:1,
                states:{
                    hover:{
                        radius:150
                    }
                }
            }
        }]
    },{
       color:'rgba(241,90,96,.5)',
       name:'that thing',
       data: [{
           x:6,
           y:60,
           marker:{
               radius:125,
               fillColor:'rgba(241,90,96,.5)',
               lineColor:'rgba(241,90,96,.75)',
               lineWidth:1,
               states:{
                   hover:{
                       radius:125
                   }
               }
           }
       }]
    },{
       color:'rgba(250,250,91,.5)',
       name:'the other thing',
       data: [{
           x:5,
           y:25,
           marker:{
               radius:50,
               fillColor:'rgba(250,250,91,.5)',
               lineColor:'rgba(250,250,91,.75)',
               lineWidth:1,
               states:{
                   hover:{
                       radius:50
                   }
               }
           }
       }]
    }]
});

1 个答案:

答案 0 :(得分:1)

没有内置任何内容来绘制椭圆标记类型。

为了在Highcharts中实现这种类型的图表,你必须自己绘制省略号。

看一下这个演示:

http://highcharts.com/demo/renderer

并在Renderer函数的文档中:

http://api.highcharts.com/highcharts#Renderer

相关问题