admin/OpenFin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: stars higher above bars + bigger label (11px bold, 130px offset, capped top 30px)

Browse Source
This commit is contained in:
OpenSquared
2026-06-25 17:30:15 +02:00
parent 1d433b4a7a
commit 50a4a55b9e
1 changed files with 10 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
frontend/src/components/InstrumentChart.tsx
View File

@@ -181,34 +181,37 @@ export default function InstrumentChart({ priceData, indicators, events = [], he
const xCoord = chart.timeScale().timeToCoordinate(ev.date as any) const xCoord = chart.timeScale().timeToCoordinate(ev.date as any)
if (xCoord === null || xCoord < 0 || xCoord > cw) continue if (xCoord === null || xCoord < 0 || xCoord > cw) continue
// Place stars at a fixed band near top of chart — never following the bars
const highPrice = candleMap[ev.date] const highPrice = candleMap[ev.date]
let yBase = ch * 0.15 // fallback: top 15% let yBase = 22
if (highPrice !== undefined) { if (highPrice !== undefined) {
const yHigh = candleSeries.priceToCoordinate(highPrice) const yHigh = candleSeries.priceToCoordinate(highPrice)
if (yHigh !== null) yBase = Math.max(20, yHigh - 52) // 130px above bar high, but always capped to top 30px of chart
if (yHigh !== null) yBase = Math.min(30, Math.max(8, yHigh - 130))
} }
const cat = ev.category ?? 'fundamental' const cat = ev.category ?? 'fundamental'
const color = CAT_COLORS[cat] ?? '#94a3b8' const color = CAT_COLORS[cat] ?? '#94a3b8'
const score = ev.impact_score ?? 0.5 const score = ev.impact_score ?? 0.5
const sz = score >= 0.8 ? 15 : score >= 0.6 ? 12 : 10 const sz = score >= 0.8 ? 18 : score >= 0.6 ? 15 : 12
const wrap = document.createElement('div') const wrap = document.createElement('div')
wrap.style.cssText = [ wrap.style.cssText = [
`position:absolute`, `left:${xCoord}px`, `top:${yBase}px`, `position:absolute`, `left:${xCoord}px`, `top:${yBase}px`,
`transform:translateX(-50%)`, `transform:translateX(-50%)`,
`display:flex`, `flex-direction:column`, `align-items:center`, `gap:1px`, `display:flex`, `flex-direction:column`, `align-items:center`, `gap:2px`,
`pointer-events:auto`, `cursor:default`, `pointer-events:auto`, `cursor:default`,
].join(';') ].join(';')
wrap.title = `${ev.title}\n${ev.date}${ev.end_date ? ' → ' + ev.end_date : ''}` wrap.title = `${ev.title}\n${ev.date}${ev.end_date ? ' → ' + ev.end_date : ''}`
const lbl = document.createElement('div') const lbl = document.createElement('div')
lbl.style.cssText = [ lbl.style.cssText = [
`font-size:8px`, `font-family:ui-monospace,monospace`, `font-size:11px`, `font-family:ui-monospace,monospace`,
`color:${color}`, `white-space:nowrap`, `color:${color}`, `white-space:nowrap`,
`text-shadow:0 1px 3px #000,0 0 6px #000`, `text-shadow:0 1px 4px #000,0 0 8px #000,-1px 0 4px #000,1px 0 4px #000`,
`line-height:1`, `max-width:90px`, `line-height:1`, `max-width:110px`,
`overflow:hidden`, `text-overflow:ellipsis`, `overflow:hidden`, `text-overflow:ellipsis`,
`font-weight:600`,
].join(';') ].join(';')
lbl.textContent = ev.title.slice(0, 22) lbl.textContent = ev.title.slice(0, 22)