Charts 如何在散点系列谷歌图表上绘制自定义多边形?

Charts 如何在散点系列谷歌图表上绘制自定义多边形?,charts,google-visualization,polygon,scatter,convex-hull,Charts,Google Visualization,Polygon,Scatter,Convex Hull,我有一个带有一组点的散点序列,如图所示 点被分组,每组以不同的颜色显示。我想在每组周围画一个多边形(凸包)。似乎没有一种简单的方法可以将每个有n个边界点的多边形添加到图表中。如果您有一个算法可以找到边界点, 您可以使用组合图来绘制散点和直线系列… 使用选项seriesType设置默认类型 使用选项series自定义特定系列的类型 在下面的工作片段中, 使用的算法是从--> (从Java版本转换而来) google.charts.load('current'{ 软件包:['corechart']

我有一个带有一组点的散点序列,如图所示


点被分组,每组以不同的颜色显示。我想在每组周围画一个多边形(凸包)。似乎没有一种简单的方法可以将每个有n个边界点的多边形添加到图表中。

如果您有一个算法可以找到边界点,
您可以使用组合图来绘制散点和直线系列…
使用选项
seriesType
设置默认类型
使用选项
series
自定义特定系列的类型

在下面的工作片段中,
使用的算法是从-->
(从Java版本转换而来)

google.charts.load('current'{
软件包:['corechart']
}).然后(函数(){
var groupA=[
[0,3],[2,3],[1,1],[2,1],[3,0],[0,0],[3,3],[2,2]
];
变量组B=[
[11,11],[12,12],[12,10],[12,14],[13,13],[14,12],[15,12],[16,12]
];
var data=new google.visualization.DataTable();
data.addColumn('number','x');
data.addColumn('number','y');
data.addRows(groupA);
data.addRows(groupB);
addGroup('A',data,groupA)
addGroup('B',data,groupB)
变量选项={
图表区:{
底图:48,
高度:“100%”,
左:36,
右:24,
排名:36,
宽度:“100%”
},
高度:“100%”,
序列类型:“行”,
系列:{
0: {
键入:“散布”
}
},
宽度:“100%”
};
var chart=new google.visualization.ComboChart(document.getElementById('chart_div'));
图纸();
window.addEventListener('resize',drawChart,false);
函数绘图图(){
图表绘制(数据、选项);
}
函数addGroup(组、数据表、点){
var多边形=凸形(点);
var colIndex=dataTable.addColumn('number',group);
对于(var i=0;i0){
返回1;//按时钟顺序
}否则{
返回2;//逆时针方向
}
}
函数convexHull(点){
//必须至少有3行
如果(点长度<3){
返回;
}
//初始化
var l=0;
var p=l;
var-q;
var外壳=[];
//找到最左边的点
对于(变量i=1;i
html,正文,图表分区{
身高:100%;
}