Implement working canvas-based trading chart

- Created SimpleTradingChart component using HTML5 Canvas
- Renders proper candlestick chart with sample SOL/USDC data
- Includes grid lines, price labels, and proper styling
- Replaced problematic lightweight-charts with working solution
- Updated trading page to use the new working chart component

Fixes chart loading issues by using native HTML5 Canvas instead of external library dependencies.
This commit is contained in:
mindesbunister
2025-07-16 13:06:58 +02:00
parent 86d4f5289c
commit c1a7a28cd8
4 changed files with 203 additions and 2 deletions

View File

@@ -4,7 +4,7 @@ import TradeExecutionPanel from '../../components/TradeExecutionPanel.js'
import PositionsPanel from '../../components/PositionsPanel.js'
import PendingOrdersPanel from '../../components/PendingOrdersPanel.js'
import TradesHistoryPanel from '../../components/TradesHistoryPanel.js'
import TradingChart from '../../components/TradingChart'
import SimpleTradingChart from '../../components/SimpleTradingChart'
export default function TradingPage() {
return (
@@ -22,7 +22,7 @@ export default function TradingPage() {
<span>1D</span>
</div>
</div>
<TradingChart symbol="SOL/USDC" positions={[]} />
<SimpleTradingChart symbol="SOL/USDC" positions={[]} />
</div>
<div className="grid grid-cols-1 xl:grid-cols-2 gap-8">