vtkCubeAxesActor Control tick labels and grid lines

Hello,

I’m using a vtk cube axes actor to generate a grid & axes over a set of points.

This is what I currently have

How might I go about changing the x ticks, grid lines, and associated axis labels so that I have lines after every 200, similar to the y axis?

Unfortunately have tried a few things but nothing has worked & can’t find any docs on this particular request

I have a similar problem. And I think I found it in the source code. Apparently, vtk cube axes actor is using a d3.ticks function to generate the appropriate lines. However, if you wish to work around it, you’ll have to extend the class such that the number of ticks is a variable. (Currently, it is set to some magic number)

In case anyone needs help, you can just extend it like so:

import macro from '@kitware/vtk.js/macros';
import vtkCubeAxesActor from '@kitware/vtk.js/Rendering/Core/CubeAxesActor';
import * as d3 from 'd3-scale';

const faceEdges = [
  [8, 7, 11, 3],
  [9, 1, 10, 5],
  [4, 9, 0, 8],
  [2, 11, 6, 10],
  [0, 3, 2, 1],
  [4, 5, 6, 7],
];

function vtkCustomCubeAxesActor(publicAPI, model) {
  model.classHierarchy.push('vtkCustomCubeAxesActor');

  publicAPI.update = () => {
    if (!model.camera) {
      return;
    }

    // compute what faces to draw
    const facesChanged = publicAPI.computeFacesToDraw();
    const facesToDraw = model.lastFacesToDraw;

    // have the bounds changed?
    let boundsChanged = false;
    for (let i = 0; i < 6; i++) {
      if (model.dataBounds[i] !== model.lastTickBounds[i]) {
        boundsChanged = true;
        model.lastTickBounds[i] = model.dataBounds[i];
      }
    }

    // did something significant change? If so rebuild a lot of things
    if (facesChanged || boundsChanged || model.forceUpdate) {
      // compute the edges to draw
      // for each drawn face, mark edges, all single mark edges we draw
      const edgesToDraw = new Array(12).fill(0);
      for (let f = 0; f < 6; f++) {
        if (facesToDraw[f]) {
          for (let e = 0; e < 4; e++) {
            edgesToDraw[faceEdges[f][e]]++;
          }
        }
      }

      // compute tick marks for axes
      const ticks = [];
      const tickStrings = [];
      for (let i = 0; i < 3; i++) {
        const scale = d3.scaleLinear().domain([model.dataBounds[i * 2], model.dataBounds[i * 2 + 1]]);
        ticks[i] = scale.ticks(model.ticksNo);
        const format = scale.tickFormat(model.ticksNo);
        tickStrings[i] = ticks[i].map(format);
      }

      // update gridlines / edge lines
      publicAPI.updatePolyData(facesToDraw, edgesToDraw, ticks);

      // compute label world coords and text
      publicAPI.updateTextData(facesToDraw, edgesToDraw, ticks, tickStrings);

      // rebuild the texture only when force or changed bounds, face
      // visibility changes do to change the atlas
      if (boundsChanged || model.forceUpdate) {
        publicAPI.updateTextureAtlas(tickStrings);
      }
    }

    model.forceUpdate = false;
  };
}

const DEFAULT_VALUES = {
  ticksNo: 10,
};

export function extend(publicAPI, model, initialValues = {}) {
  Object.assign(model, DEFAULT_VALUES, initialValues);

  vtkCubeAxesActor.extend(publicAPI, model, initialValues);
  macro.setGet(publicAPI, model, ['ticksNo']);
  vtkCustomCubeAxesActor(publicAPI, model);
}

export const newInstance = macro.newInstance(extend, 'vtkCustomCubeAxesActor');

export default { newInstance, extend };

1 Like