diff --git a/src/components/widget-plot/plot.js b/src/components/widget-plot/plot.js index 986db6f..a3f6d37 100644 --- a/src/components/widget-plot/plot.js +++ b/src/components/widget-plot/plot.js @@ -56,7 +56,7 @@ class Plot extends React.Component { } const xAxis = axisBottom().scale(xScale).ticks(5).tickFormat(timeFormat("%M:%S")); - const yAxis = axisLeft().scale(yScale).ticks(5).tickFormat(format(".1g")); + const yAxis = axisLeft().scale(yScale).ticks(5).tickFormat(format(".3s")); this.state = { data: null, @@ -99,7 +99,7 @@ class Plot extends React.Component { } const xAxis = axisBottom().scale(xScale).ticks(5).tickFormat(timeFormat("%M:%S")); - const yAxis = axisLeft().scale(yScale).ticks(5).tickFormat(format(".1g")); + const yAxis = axisLeft().scale(yScale).ticks(5).tickFormat(format(".3s")); this.setState({ data: null, xAxis, yAxis, labelMargin }); return; @@ -171,7 +171,7 @@ class Plot extends React.Component { const yScale = scaleLinear().domain(yRange).range([this.props.height + topMargin - bottomMargin, topMargin]); const xAxis = axisBottom().scale(xScale).ticks(5).tickFormat(timeFormat("%M:%S")); - const yAxis = axisLeft().scale(yScale).ticks(5).tickFormat(format(".1g")); + const yAxis = axisLeft().scale(yScale).ticks(5).tickFormat(format(".3s")); // generate paths from data const sparkLine = line().x(p => xScale(p.x)).y(p => yScale(p.y)); diff --git a/src/components/widgets/slider.js b/src/components/widgets/slider.js index 49f1994..4212eef 100644 --- a/src/components/widgets/slider.js +++ b/src/components/widgets/slider.js @@ -21,6 +21,7 @@ ******************************************************************************/ import React, { Component } from 'react'; +import { format } from 'd3'; import classNames from 'classnames'; import Slider from 'rc-slider'; import 'rc-slider/assets/index.css'; @@ -64,6 +65,7 @@ class WidgetSlider extends Component { // Check if the orientation changed, update the size if it did if (this.props.widget.orientation !== nextProps.widget.orientation) { let baseWidget = nextProps.widget; + // Exchange dimensions and constraints let newWidget = Object.assign({}, baseWidget, { width: baseWidget.height, @@ -73,6 +75,7 @@ class WidgetSlider extends Component { maxWidth: baseWidget.maxHeight, maxHeight: baseWidget.maxWidth }); + nextProps.onWidgetChange(newWidget); } } @@ -96,7 +99,7 @@ class WidgetSlider extends Component { let fields = { name: this.props.widget.name, control: this.valueIsChanging(v) } onAfterChange={ (v) => this.valueChanged(v) }/>, - value: { Number.parseFloat(this.state.value).toPrecision(3) }, + value: { format('.3s')(Number.parseFloat(this.state.value)) }, unit: { this.state.unit } } diff --git a/src/components/widgets/table.js b/src/components/widgets/table.js index 0be4178..c2025f6 100644 --- a/src/components/widgets/table.js +++ b/src/components/widgets/table.js @@ -20,6 +20,7 @@ ******************************************************************************/ import React, { Component } from 'react'; +import { format } from 'd3'; import Table from '../table'; import TableColumn from '../table-column'; @@ -30,7 +31,8 @@ class WidgetTable extends Component { this.state = { rows: [], - sequence: null + sequence: null, + showUnit: false }; } @@ -48,8 +50,9 @@ class WidgetTable extends Component { || nextProps.data[simulator].output == null || nextProps.data[simulator].output.values.length === 0 || nextProps.data[simulator].output.values[0].length === 0) { + // clear values - this.setState({ rows: [], sequence: null }); + this.setState({ rows: [], sequence: null, showUnit: false }); return; } @@ -65,20 +68,28 @@ class WidgetTable extends Component { if (index < nextProps.simulationModel.outputMapping.length) { rows.push({ name: nextProps.simulationModel.outputMapping[index].name, - value: signal[signal.length - 1].y.toFixed(3) + unit: nextProps.simulationModel.outputMapping[index].type, + value: signal[signal.length - 1].y }); } }); - this.setState({ rows: rows, sequence: nextProps.data[simulator].output.sequence }); + this.setState({ showUnit: nextProps.showUnit, rows: rows, sequence: nextProps.data[simulator].output.sequence }); } render() { + var columns = [ + , + + ]; + + if (this.props.widget.showUnit) + columns.push() + return (
- - + { columns }
);