diff --git a/src/actions/index.js b/src/actions/index.js index 9730c21..0035777 100644 --- a/src/actions/index.js +++ b/src/actions/index.js @@ -302,6 +302,14 @@ export function updateColoringSet(coloringSet) { }; } +export const UPDATE_TICKS = "UPDATE_TICKS"; +export function updateTicks(ticks) { + return { + type: UPDATE_TICKS, + ticks, + }; +} + // UI export const TOGGLE_SITES = "TOGGLE_SITES"; diff --git a/src/components/time/Axis.js b/src/components/time/Axis.js index 3b71314..133a8a6 100644 --- a/src/components/time/Axis.js +++ b/src/components/time/Axis.js @@ -27,21 +27,22 @@ class TimelineAxis extends React.Component { fstFmt = ""; } else { sndFmt = "%d %b"; - fstFmt = "%H:%M"; + // fstFmt = "%H:%M"; + fstFmt = ""; } const { marginTop, contentHeight } = this.props.dims; if (this.props.scaleX) { this.x0 = d3 .axisBottom(this.props.scaleX) - .ticks(15) + .ticks(this.props.ticks) .tickPadding(0) .tickSize(contentHeight - TEXT_HEIGHT - marginTop) .tickFormat(d3.timeFormat(fstFmt)); this.x1 = d3 .axisBottom(this.props.scaleX) - .ticks(15) + .ticks(this.props.ticks) .tickPadding(marginTop) .tickSize(0) .tickFormat(d3.timeFormat(sndFmt)); diff --git a/src/components/time/Timeline.js b/src/components/time/Timeline.js index 4feafff..763da7b 100644 --- a/src/components/time/Timeline.js +++ b/src/components/time/Timeline.js @@ -4,7 +4,7 @@ import { connect } from "react-redux"; import * as d3 from "d3"; import hash from "object-hash"; -import { setLoading, setNotLoading } from "../../actions"; +import { setLoading, setNotLoading, updateTicks } from "../../actions"; import * as selectors from "../../selectors"; import copy from "../../common/data/copy.json"; @@ -239,6 +239,7 @@ class Timeline extends React.Component { timerange: [newDomain0, newDomainF], }, () => { + this.props.actions.updateTicks(15); this.props.methods.onUpdateTimerange(this.state.timerange); } ); @@ -347,6 +348,7 @@ class Timeline extends React.Component { ); const start = d3.timeMinute.offset(event.datetime, -timeframe); const end = d3.timeMinute.offset(event.datetime, timeframe); + this.props.actions.updateTicks(1); this.props.methods.onUpdateTimerange([start, end]); } this.props.methods.onSelect(event); @@ -388,6 +390,7 @@ class Timeline extends React.Component {