diff options
| author | mat <github@matdoes.dev> | 2022-05-18 01:21:16 +0000 |
|---|---|---|
| committer | mat <github@matdoes.dev> | 2022-05-18 01:21:16 +0000 |
| commit | 7a04672666e9c366e7bbf241ed82efe481dc9492 (patch) | |
| tree | a4b0f2e7363bb199bd9e4a0dba82e7d3df1bab47 /src/lib/AuctionPriceScatterplot.svelte | |
| parent | f9bb90cab81e7c7f8c2a7e932bbf2ddbf7b51f1f (diff) | |
| download | skyblock-stats-7a04672666e9c366e7bbf241ed82efe481dc9492.tar.gz skyblock-stats-7a04672666e9c366e7bbf241ed82efe481dc9492.tar.bz2 skyblock-stats-7a04672666e9c366e7bbf241ed82efe481dc9492.zip | |
grid background improvement
Diffstat (limited to 'src/lib/AuctionPriceScatterplot.svelte')
| -rw-r--r-- | src/lib/AuctionPriceScatterplot.svelte | 19 |
1 files changed, 15 insertions, 4 deletions
diff --git a/src/lib/AuctionPriceScatterplot.svelte b/src/lib/AuctionPriceScatterplot.svelte index 1e774d0..0532f97 100644 --- a/src/lib/AuctionPriceScatterplot.svelte +++ b/src/lib/AuctionPriceScatterplot.svelte @@ -9,8 +9,12 @@ let maxCoins: number = item.auctions.reduce((max, auction) => Math.max(max, auction.coins), 0) let currentTimestamp = Math.floor(Date.now() / 1000) let earliestTimestamp = item.auctions.length > 0 ? item.auctions[0].ts : 0 - let minutesBetween = (currentTimestamp - earliestTimestamp) / 360 - let gridWidth = 100 / minutesBetween + let hoursBetween = (currentTimestamp - earliestTimestamp) / (60 * 60) + const gridWidth = 100 / hoursBetween + + let heightCoinInterval = Math.pow(10, Math.floor(Math.log10(maxCoins / 2))) + + const gridHeight = 100 / (maxCoins / heightCoinInterval) function getAuctionCoordinates(auction: SimpleAuctionSchema) { const timestampPercentage = @@ -52,8 +56,15 @@ <svg viewBox="0 0 100 100" class="item-auction-history"> <defs> - <pattern id="grid-{item._id}" width={gridWidth} height="10" patternUnits="userSpaceOnUse"> - <path d="M {gridWidth} 0 L 0 0 0 10" fill="none" stroke="#fff2" stroke-width="1" /> + <pattern + id="grid-{item._id}" + width={gridWidth} + height={gridHeight} + patternUnits="userSpaceOnUse" + x="0%" + y="100%" + > + <path d="M {gridWidth} 0 L 0 0 0 {gridHeight}" fill="none" stroke="#fff2" stroke-width="1" /> </pattern> </defs> <rect |