在Plotly-javascript中是否可通过参数设置按度数旋转图表?
Plotly.js 实现原点移至右上角的方案
可以实现该需求,优先通过坐标轴反转配置完成,不会影响图表原有交互能力,比整体旋转DOM更稳定。
推荐方案:反转X、Y轴范围
Plotly.js默认的坐标轴规则为X轴从左到右数值递增,Y轴从下到上数值递增,因此原点默认在左下角。要将原点移至右上角,只需将两个坐标轴的数值范围同时反转即可,配置示例如下:
// 示例数据 const trace = { x: [1, 2, 3, 4], y: [10, 15, 13, 17], type: 'scatter' }; // 核心配置:反转X、Y轴 const layout = { xaxis: { autorange: 'reversed' // X轴数值从右到左递增 }, yaxis: { autorange: 'reversed' // Y轴数值从上到下递增 } }; Plotly.newPlot('myDiv', [trace], layout);
可选方案:整体旋转图表(不推荐)
如果确实需要将整个图表(包含图例、标题等所有元素)旋转180度,可以通过CSS实现,但会导致hover提示、缩放等交互功能错位,仅适合纯静态展示场景:
#myDiv { transform: rotate(180deg); }
内容的提问来源于stack exchange,提问作者Logeshwar K M bs17b019
相关产品推荐
相关产品推荐

