如何更改 JSXGraph 轴图中网格线的粗细？

Question

在默认的板轴（例如https://jsfiddle.net/dr63zumf/1/）、下面的截图和代码中，如何更改网格线的粗细或宽度以使其更粗？文档中似乎没有这个选项。

谢谢，

罗布

const board = JXG.JSXGraph.initBoard('jxgbox', { 
    boundingbox: [-5, 5, 5, -5], axis:true
});

default grid layout

Answer 1

这可以通过属性defaultAxes来实现：

const board = JXG.JSXGraph.initBoard('jxgbox', { 
    boundingbox: [-5, 5, 5, -5], 
    axis:true,
    defaultAxes: {
        x: {
            ticks: {
                strokeWidth: 5
            }
        },
        y: {
            ticks: {
               strokeWidth: 5
            }
        }
    }
});

在 https://jsfiddle.net/oucfp3ea/1/

现场观看

Answer 2

回复 Rob 的评论：

minorTicks 和 majorTicks 不可能有不同的宽度，因为在内部一个轴的刻度元素是一个 SVG 路径。但是，有几种可能的解决方法：

1) 完全不显示 minorTicks:

const board = JXG.JSXGraph.initBoard('jxgbox', { 
    boundingbox: [-5, 5, 5, -5], 
    axis:true,
    defaultAxes: {
      x: {
        ticks: {
            strokeWidth: 5,
            minorTicks: 0
        }
      },
      y: {
        ticks: {
           strokeWidth: 5,
           minorTicks: 0
        }
      }
    }
});

2) 如果你坚持使用次要刻度和主要刻度，则不要在默认轴的默认刻度中显示 majorTicks，但添加粗刻度而不显示minorTicks 到默认轴，参见 https://jsfiddle.net/vf3muqgn/1/:

  const board = JXG.JSXGraph.initBoard('jxgbox', { 
    boundingbox: [-5, 5, 5, -5], 
    axis:true,
    defaultAxes: {
        x: {
        ticks: {
          majorHeight: 0
        }
      },
        y: {
        ticks: {
          majorHeight: 0
        }
      }
    }
  });

  board.create('ticks', [board.defaultAxes.x], {
    strokeColor: '#cccccc',
    minorTicks: 0,
    majorHeight: -1,
    strokeWidth: 3
  });
  board.create('ticks', [board.defaultAxes.y], {
    strokeColor: '#cccccc',
    minorTicks: 0,
    majorHeight: -1,
    strokeWidth: 3
  });

如何更改 JSXGraph 轴图中网格线的粗细？

How can the thickness of gridlines in JSXGraph axis plots be changed?

javascript

jsxgraph