Как можно изменить толщину линий сетки на графиках осей JSXGraph? - PullRequest
Новая
       40

Как можно изменить толщину линий сетки на графиках осей JSXGraph?

0 голосов
/ 22 апреля 2020

На осях платы по умолчанию (например, https://jsfiddle.net/dr63zumf/1/), снимок экрана и код ниже, как я могу изменить толщину или ширину линий сетки, чтобы сделать их толще? Похоже, что в документации этого нет.

Спасибо,

Роб 

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

макет сетки по умолчанию

Ответы [ 2 ]

0 голосов
/ 28 апреля 2020

Отвечая на комментарий Роба:

Невозможно иметь разную ширину для 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) Если вы настаиваете на небольших тиках и Major тики, тогда не показывайте 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
  });
0 голосов
/ 22 апреля 2020

Это может быть реализовано с атрибутом 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/

...