From 00bc8d6068178ebd9b2ba6f5633a079be77876b9 Mon Sep 17 00:00:00 2001 From: James Grugett Date: Fri, 6 May 2022 13:58:38 -0400 Subject: [PATCH] Add numeric graph (coded without testing) --- common/calculate-dpm.ts | 7 ++ common/contract.ts | 5 +- web/components/contract/contract-overview.tsx | 21 +++--- web/components/contract/numeric-graph.tsx | 70 +++++++++++++++++++ 4 files changed, 93 insertions(+), 10 deletions(-) create mode 100644 web/components/contract/numeric-graph.tsx diff --git a/common/calculate-dpm.ts b/common/calculate-dpm.ts index 976d1b57..da929909 100644 --- a/common/calculate-dpm.ts +++ b/common/calculate-dpm.ts @@ -19,6 +19,13 @@ export function getDpmOutcomeProbability( return shares ** 2 / squareSum } +export function getDpmOutcomeProbabilities(totalShares: { + [outcome: string]: number +}) { + const squareSum = _.sumBy(Object.values(totalShares), (shares) => shares ** 2) + return _.mapValues(totalShares, (shares) => shares ** 2 / squareSum) +} + export function getDpmOutcomeProbabilityAfterBet( totalShares: { [outcome: string]: number diff --git a/common/contract.ts b/common/contract.ts index 5ed263b7..1d407cbd 100644 --- a/common/contract.ts +++ b/common/contract.ts @@ -40,7 +40,10 @@ export type FullContract< } & M & T -export type Contract = FullContract +export type Contract = FullContract< + DPM | CPMM, + Binary | Multi | FreeResponse | Numeric +> export type BinaryContract = FullContract export type FreeResponseContract = FullContract export type NumericContract = FullContract diff --git a/web/components/contract/contract-overview.tsx b/web/components/contract/contract-overview.tsx index 524a1962..3084485c 100644 --- a/web/components/contract/contract-overview.tsx +++ b/web/components/contract/contract-overview.tsx @@ -14,10 +14,16 @@ import { Bet } from '../../../common/bet' import { Comment } from '../../../common/comment' import BetRow from '../bet-row' import { AnswersGraph } from '../answers/answers-graph' -import { DPM, FreeResponse, FullContract } from '../../../common/contract' +import { + DPM, + FreeResponse, + FullContract, + NumericContract, +} from '../../../common/contract' import { ContractDescription } from './contract-description' import { ContractDetails } from './contract-details' import { ShareMarket } from '../share-market' +import { NumericGraph } from './numeric-graph' export const ContractOverview = (props: { contract: Contract @@ -73,22 +79,19 @@ export const ContractOverview = (props: { isCreator={isCreator} /> - - - {isBinary ? ( - - ) : ( + {isBinary && }{' '} + {outcomeType === 'FREE_RESPONSE' && ( } bets={bets} /> )} - + {outcomeType === 'NUMERIC' && ( + + )} {(contract.description || isCreator) && } - {isCreator && } - min + ((max - min) * i) / bucketCount + ) + const probs = _.range(bucketCount).map((i) => bucketProbs[`${i}`]) + const points = probs.map((prob, i) => ({ x: xs[i], y: prob * 100 })) + const data = [{ id: 'Probability', data: points, color: '#b91181' }] + + const yTickValues = [0, 25, 50, 75, 100] + + const { width } = useWindowSize() + + const numXTickValues = !width || width < 800 ? 2 : 5 + + return ( +
= 800 ? 350 : 250) }} + > + `${Math.round(+d * 100) / 100}`} + axisBottom={{ + tickValues: numXTickValues, + format: (d) => `${Math.round(+d * 100) / 100}`, + }} + colors={{ datum: 'color' }} + pointSize={0} + pointBorderWidth={1} + pointBorderColor="#fff" + enableSlices="x" + enableGridX={!!width && width >= 800} + enableArea + margin={{ top: 20, right: 28, bottom: 22, left: 40 }} + /> +
+ ) +}) + +function formatPercent(y: DatumValue) { + return `${Math.round(+y.toString())}%` +}