Tweaks to value formatting

This commit is contained in:
Jamie Wong 2018-01-06 20:04:54 -05:00
parent 0f776cfb10
commit f72ea82146
5 changed files with 20 additions and 10 deletions

View File

@ -91,6 +91,9 @@ export class FlamechartMinimapView extends Component<FlamechartMinimapViewProps,
const left = 0
const right = this.configSpaceSize().x
// TODO(jlfwong): There's a huge amount of code duplication here between
// this and the FlamechartView.renderOverlays(). Consolidate.
// We want about 10 gridlines to be visible, and want the unit to be
// 1eN, 2eN, or 5eN for some N

View File

@ -610,7 +610,14 @@ export class FlamechartView extends ReloadableComponent<FlamechartViewProps, Fla
formatValue(weight: number) {
const totalWeight = this.props.flamechart.getTotalWeight()
return `${this.props.flamechart.formatValue(weight)} (${(100 * weight/totalWeight).toFixed()}%)`
const percent = 100 * weight / totalWeight
let formattedPercent = `${percent.toFixed(0)}%`
if (percent === 100) formattedPercent = '100%'
else if (percent > 99) formattedPercent = '>99%'
else if (percent < 1) formattedPercent = `${percent.toFixed(2)}%`
else if (percent < 10) formattedPercent = `${percent.toFixed(1)}%`
return `${this.props.flamechart.formatValue(weight)} (${formattedPercent})`
}
renderTooltip() {

View File

@ -107,6 +107,6 @@ export function importFromChrome(events: TimelineEvent[]) {
profile.appendSample(stack, timeDelta)
}
profile.setValueFormatter(new TimeFormatter('us'))
profile.setValueFormatter(new TimeFormatter('microseconds'))
return profile
}

View File

@ -41,6 +41,6 @@ export function importFromStackprof(stackprofProfile: StackprofProfile): Profile
profile.appendSample(stack, sampleDuration)
}
profile.setValueFormatter(new TimeFormatter('us'))
profile.setValueFormatter(new TimeFormatter('microseconds'))
return profile
}

View File

@ -84,19 +84,19 @@ export class RawValueFormatter implements ValueFormatter {
export class TimeFormatter implements ValueFormatter {
private multiplier : number
constructor(unit: 'ns' | 'us' | 'ms' | 's' = 'ns') {
if (unit === 'ns') this.multiplier = 1e-9
else if (unit === 'us') this.multiplier = 1e-6
else if (unit === 'ms') this.multiplier = 1e-3
constructor(unit: 'nanoseconds' | 'microseconds' | 'milliseconds' | 'seconds') {
if (unit === 'nanoseconds') this.multiplier = 1e-9
else if (unit === 'microseconds') this.multiplier = 1e-6
else if (unit === 'milliseconds') this.multiplier = 1e-3
else this.multiplier = 1
}
format(v: number) {
const s = v * this.multiplier
if (s / 1e0 > 1) return `${s.toFixed(2)}s`
if (s / 1e-3 > 1) return `${(s / 1e-3).toFixed(2)}ms`
if (s / 1e-6 > 1) return `${(s / 1e-6).toFixed(2)}us`
if (s / 1e0 >= 1) return `${s.toFixed(2)}s`
if (s / 1e-3 >= 1) return `${(s / 1e-3).toFixed(2)}ms`
if (s / 1e-6 >= 1) return `${(s / 1e-6).toFixed(2)}µs`
else return `${(s / 1e-9).toFixed(2)}ms`
}
}