d3plus-timeline

An easy-to-use javascript timeline.

Installing

If you use NPM, npm install d3plus-timeline. Otherwise, download the latest release. You can also load d3plus-timeline as a standalone library or as part of D3plus. ES modules, AMD, CommonJS, and vanilla environments are supported. In vanilla, a d3plus global is exported:

<script src="https://cdn.jsdelivr.net/npm/d3plus-timeline@1"></script>
<script>
  console.log(d3plus);
</script>

API Reference

• Timeline

Timeline <>

This is a global class, and extends all of the methods and functionality of Axis.

• Timeline ⇐ Axis
  • .render([callback]) ↩︎
  • .buttonPadding([value]) ↩︎
  • .brushing([value]) ↩︎
  • .brushFilter([value]) ↩︎
  • .brushMin([value]) ↩︎
  • .buttonAlign([value]) ↩︎
  • .buttonBehavior([value]) ↩︎
  • .buttonHeight([value]) ↩︎
  • .handleConfig([value]) ↩︎
  • .handleSize([value]) ↩︎
  • .on([typename], [listener]) ↩︎
  • .selectionConfig([value]) ↩︎
  • .selection([value]) ↩︎
  • .snapping([value]) ↩︎

# Timeline.render([callback]) <>

Draws the timeline.

This is a static method of Timeline, and is chainable with other methods of this Class.

# Timeline.buttonPadding([value]) <>

If value is specified, sets the button padding and returns the current class instance. If value is not specified, returns the current button padding.

This is a static method of Timeline, and is chainable with other methods of this Class.

# Timeline.brushing([value]) <>

If value is specified, toggles the brushing value and returns the current class instance. If value is not specified, returns the current brushing value.

This is a static method of Timeline, and is chainable with other methods of this Class.

# Timeline.brushFilter([value]) <>

If value is specified, sets the brush event filter and returns the current class instance. If value is not specified, returns the current brush event filter.

This is a static method of Timeline, and is chainable with other methods of this Class.

function() {
  return !event.button && event.detail < 2;
}

# Timeline.brushMin([value]) <>

Sets the minimum number of "ticks" to allow to be highlighted when using "ticks" buttonBehavior. Helpful when using x/y plots where you don't want the user to select less than 2 time periods. Value passed can either be a static Number, or a function that is expected to return a Number.

This is a static method of Timeline, and is chainable with other methods of this Class.

# Timeline.buttonAlign([value]) <>

If value is specified, toggles the horizontal alignment of the button timeline. Accepted values are "start", "middle" and "end". If value is not specified, returns the current button value.

This is a static method of Timeline, and is chainable with other methods of this Class.

# Timeline.buttonBehavior([value]) <>

If value is specified, toggles the style of the timeline. Accepted values are "auto", "buttons" and "ticks". If value is not specified, returns the current button value.

This is a static method of Timeline, and is chainable with other methods of this Class.

# Timeline.buttonHeight([value]) <>

If value is specified, sets the button height and returns the current class instance. If value is not specified, returns the current button height.

This is a static method of Timeline, and is chainable with other methods of this Class.

# Timeline.handleConfig([value]) <>

If value is specified, sets the handle style and returns the current class instance. If value is not specified, returns the current handle style.

This is a static method of Timeline, and is chainable with other methods of this Class.

# Timeline.handleSize([value]) <>

If value is specified, sets the handle size and returns the current class instance. If value is not specified, returns the current handle size.

This is a static method of Timeline, and is chainable with other methods of this Class.

# Timeline.on([typename], [listener]) <>

Adds or removes a listener for the specified brush event typename. If a listener is not specified, returns the currently-assigned listener for the specified event typename. Mirrors the core d3-brush behavior.

This is a static method of Timeline, and is chainable with other methods of this Class.

| Param | Type | | --- | --- | | [typename] | String | Object | | [listener] | function |

# Timeline.selectionConfig([value]) <>

If value is specified, sets the selection style and returns the current class instance. If value is not specified, returns the current selection style.

This is a static method of Timeline, and is chainable with other methods of this Class.

# Timeline.selection([value]) <>

If value is specified, sets the selection and returns the current class instance. If value is not specified, returns the current selection. Defaults to the most recent year in the timeline.

This is a static method of Timeline, and is chainable with other methods of this Class.

# Timeline.snapping([value]) <>

If value is specified, toggles the snapping value and returns the current class instance. If value is not specified, returns the current snapping value.

This is a static method of Timeline, and is chainable with other methods of this Class.

Documentation generated on Tue, 26 Mar 2024 15:51:46 GMT