javascript - echarts 自定义报错findAxisModel？

Question

需要实现一个扇形的网格，并在上面标注轨迹，极坐标一直是圆形的，使用自定义报错of undefined (reading 'findAxisModel')"

option = {

    tooltip: {},    series: [      {        type: 'custom',        coordinateSystem: 'polar',        shape: function(points, params) {          var angleStep = Math.PI / 10 // 角度间隔          var startAngle = -Math.PI / 2 // 起始角度          var lines = []          for (var i = startAngle; i <= Math.PI / 2; i += angleStep) {            var polarPoints = []            var r1 = params.radius[0]            var r2 = params.radius[1]            polarPoints.push([r1 * Math.cos(i), r1 * Math.sin(i)])            polarPoints.push([r2 * Math.cos(i), r2 * Math.sin(i)])            lines.push(polarPoints)          }          return { lines: lines }        },        lineStyle: {          color: '#ccc',          width: 1        },        silent: true      }    ]  }

这是自定义的写法，运行不出来，各位大佬给出出注意

Answer 1

看起来你的代码在自定义的 ECharts 扇形网格上遇到了问题。问题在于你试图使用 findAxisModel 方法，但是报错提示找不到这个方法。

ECharts 的 findAxisModel 方法是用于根据坐标轴类型和名称查找坐标轴配置。然而，根据你的代码，你在这里并不需要这个方法，你可能在使用一个错误的方法或者是在错误的地方使用它。

你提供的代码是一个自定义的扇形网格，并且你已经设置了极坐标系 (coordinateSystem: 'polar')。你的形状函数 (shape 属性) 定义了扇形的轨迹线，并且你已经设置了线样式 (lineStyle)。

如果你的问题是扇形轨迹线没有正确显示，那可能是由于起始角度设置不正确或者角度间隔设置不正确。你可以尝试调整 startAngle 和 angleStep 的值，看看是否可以解决问题。

另外，你的代码中 Math.PI / 2 应该是 Math.PI / 2 + startAngle，否则你的轨迹线将从 -π/2 开始绘制，这可能不是你想要的。

你可以试试以下代码：

option = {  tooltip: {},  series: [    {      type: 'custom',      coordinateSystem: 'polar',      shape: function(points, params) {        var angleStep = Math.PI / 10; // 角度间隔        var startAngle = -Math.PI / 2; // 起始角度        var lines = [];        for (var i = startAngle; i <= Math.PI / 2 + startAngle; i += angleStep) {          var polarPoints = [];          var r1 = params.radius[0];          var r2 = params.radius[1];          polarPoints.push([r1 * Math.cos(i), r1 * Math.sin(i)]);          polarPoints.push([r2 * Math.cos(i), r2 * Math.sin(i)]);          lines.push(polarPoints);        }        return { lines: lines };      },      lineStyle: {        color: '#ccc',        width: 1,      },      silent: true,    },  ],};

希望这能帮助到你。如果还有其他问题，欢迎继续提问。