Plotly绘制多边形结果异常，如何对多边形顶点排序？

要让Plotly正确绘制填充多边形，核心是把点按围绕多边形重心的极角排序，确保点按顺时针或逆时针顺序连接，避免连线交叉导致填充异常。

具体实现步骤 #

• 计算所有点的重心（x、y坐标的平均值），作为极角计算的参考点
• 计算每个点相对于重心的极角
• 按极角从小到大（或从大到小）排序所有点
• 用排序后的点数组替换原X0、Y0，再传入Plotly绘图

代码示例（基于NumPy） #

import numpy as np
import plotly.graph_objects as go

# 假设你的原始点数组
X0 = [1, 3, 2, 0]
Y0 = [0, 1, 3, 2]

# 1. 转换为点数组
points = np.column_stack((X0, Y0))

# 2. 计算重心
cx = np.mean(points[:, 0])
cy = np.mean(points[:, 1])

# 3. 计算每个点的极角（相对于重心）
angles = np.arctan2(points[:, 1] - cy, points[:, 0] - cx)

# 4. 按极角排序点
sorted_indices = np.argsort(angles)
sorted_points = points[sorted_indices]

# 5. 提取排序后的x、y数组
sorted_X = sorted_points[:, 0]
sorted_Y = sorted_points[:, 1]

# 用排序后的点绘制多边形
polygon = go.Scatter(
    x=sorted_X,
    y=sorted_Y,
    showlegend=False,
    mode="lines",
    fill="toself",
    line=dict(color="LightSeaGreen", width=2),
)

# 绘图
fig = go.Figure(data=[polygon])
fig.show()

补充说明 #

• 默认按逆时针顺序排序，若需要顺时针，将排序逻辑改为np.argsort(-angles)即可
• 即使是凹多边形，这种极角排序方法依然有效，只要原始点确实属于同一个多边形的顶点

内容的提问来源于stack exchange，提问作者Tengis