Changed around line 1
+ document.addEventListener('DOMContentLoaded', function() {
+ // Initialize chart
+ const ctx = document.getElementById('results-chart').getContext('2d');
+ let chart = null;
+
+ function initChart() {
+ const data = {
+ labels: [],
+ datasets: [{
+ label: 'Portfolio Value',
+ data: [],
+ borderColor: '#2962ff',
+ fill: false
+ }]
+ };
+
+ const config = {
+ type: 'line',
+ data: data,
+ options: {
+ responsive: true,
+ maintainAspectRatio: false,
+ scales: {
+ x: {
+ display: true,
+ title: {
+ display: true,
+ text: 'Date'
+ }
+ },
+ y: {
+ display: true,
+ title: {
+ display: true,
+ text: 'Value'
+ }
+ }
+ }
+ }
+ };
+
+ chart = new Chart(ctx, config);
+ }
+
+ // Run backtest button click handler
+ document.getElementById('run-backtest').addEventListener('click', function() {
+ const strategy = document.getElementById('strategy').value;
+ const startDate = document.getElementById('start-date').value;
+ const endDate = document.getElementById('end-date').value;
+
+ // Simulate backtest results
+ const results = simulateBacktest(strategy, startDate, endDate);
+ updateChart(results);
+ updateMetrics(results);
+ });
+
+ function simulateBacktest(strategy, startDate, endDate) {
+ // Placeholder for backtest simulation
+ const days = 100;
+ const data = [];
+ let value = 10000;
+
+ for (let i = 0; i < days; i++) {
+ value *= (1 + (Math.random() - 0.5) * 0.02);
+ data.push(value);
+ }
+
+ return {
+ values: data,
+ sharpe: (Math.random() * 2).toFixed(2),
+ drawdown: (Math.random() * -15).toFixed(2),
+ returns: (Math.random() * 25).toFixed(2),
+ winRate: (Math.random() * 60 + 40).toFixed(2)
+ };
+ }
+
+ function updateChart(results) {
+ if (chart) {
+ chart.destroy();
+ }
+
+ const labels = results.values.map((_, i) => `Day ${i + 1}`);
+ const data = {
+ labels: labels,
+ datasets: [{
+ label: 'Portfolio Value',
+ data: results.values,
+ borderColor: '#2962ff',
+ fill: false
+ }]
+ };
+
+ chart = new Chart(ctx, {
+ type: 'line',
+ data: data,
+ options: {
+ responsive: true,
+ maintainAspectRatio: false
+ }
+ });
+ }
+
+ function updateMetrics(results) {
+ document.getElementById('sharpe').textContent = results.sharpe;
+ document.getElementById('drawdown').textContent = results.drawdown + '%';
+ document.getElementById('returns').textContent = results.returns + '%';
+ document.getElementById('winrate').textContent = results.winRate + '%';
+ }
+
+ // Smooth scroll for navigation
+ document.querySelectorAll('a[href^="#"]').forEach(anchor => {
+ anchor.addEventListener('click', function(e) {
+ e.preventDefault();
+ document.querySelector(this.getAttribute('href')).scrollIntoView({
+ behavior: 'smooth'
+ });
+ });
+ });
+
+ // Initialize the chart
+ initChart();
+ });