File size: 6,657 Bytes
e859d8e
 
 
 
4019355
e859d8e
5e4dd46
 
 
4019355
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
e859d8e
5e4dd46
 
 
 
b6a7bc8
 
4019355
5e4dd46
 
4019355
5e4dd46
 
 
 
 
 
b6a7bc8
5e4dd46
 
 
 
4019355
5e4dd46
e859d8e
11a6361
e859d8e
5e4dd46
e859d8e
 
 
5e4dd46
 
11a6361
5e4dd46
 
 
 
 
 
4019355
5e4dd46
 
 
 
 
 
 
 
 
e859d8e
 
5e4dd46
e859d8e
5e4dd46
e859d8e
5e4dd46
 
e859d8e
 
3d74982
5e4dd46
b6a7bc8
5e4dd46
b6a7bc8
5e4dd46
 
 
e859d8e
5e4dd46
 
 
 
 
 
 
 
b6a7bc8
5e4dd46
 
 
 
 
 
 
 
 
 
 
b6a7bc8
5e4dd46
 
 
 
 
 
b6a7bc8
 
 
5e4dd46
b6a7bc8
 
c2d59df
b6a7bc8
5e4dd46
b6a7bc8
5e4dd46
 
 
 
b6a7bc8
 
9686866
 
5e4dd46
b6a7bc8
 
 
 
 
 
 
868baee
11a6361
5e4dd46
e859d8e
5e4dd46
 
 
 
 
 
 
 
 
e859d8e
b6a7bc8
 
5e4dd46
b6a7bc8
 
c2d59df
b6a7bc8
 
 
 
 
e859d8e
 
5e4dd46
 
 
e859d8e
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
  <title>Crypto Trading Advisor</title>
  <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs"></script>
  <script src="https://cdn.tailwindcss.com"></script>
  <style>
    @media (max-width: 768px) {
      .container {
        padding: 1rem;
      }
      .text-3xl {
        font-size: 1.5rem;
      }
      .text-xl {
        font-size: 1rem;
      }
      .px-4 {
        padding-left: 1rem;
        padding-right: 1rem;
      }
      .py-2 {
        padding-top: 0.5rem;
        padding-bottom: 0.5rem;
      }
    }
  </style>
</head>
<body class="bg-gray-100 text-gray-800 font-sans">
  <div class="container mx-auto p-4">
    <h1 class="text-3xl font-bold text-center mb-6">Crypto Trading Advisor</h1>

    <!-- Выбор криптовалюты -->
    <div class="flex justify-center mb-4">
      <select id="crypto-select" class="p-2 border border-gray-300 rounded-md shadow-md w-full">
        <option value="">Загрузка криптовалют...</option>
      </select>
      <button id="get-advice" class="ml-4 px-4 py-2 bg-blue-500 text-white rounded-md shadow-md hover:bg-blue-600 w-full">
        Получить совет
      </button>
    </div>

    <!-- Результаты -->
    <div id="result" class="bg-white p-6 rounded-md shadow-md">
      <p class="text-center text-gray-500">Выберите криптовалюту, чтобы увидеть советы и графики.</p>
    </div>

    <!-- График -->
    <div class="mt-6">
      <canvas id="crypto-chart" class="bg-white p-4 rounded-md shadow-md w-full"></canvas>
    </div>
  </div>

  <script>
    const API_BASE = 'https://api.coingecko.com/api/v3';
    const resultDiv = document.getElementById('result');
    const select = document.getElementById('crypto-select');
    const button = document.getElementById('get-advice');
    const chartCanvas = document.getElementById('crypto-chart');
    let chartInstance;

    // Загрузка списка криптовалют
    async function loadCryptos() {
      try {
        const response = await fetch(`${API_BASE}/coins/list`);
        const data = await response.json();
        select.innerHTML = data
          .slice(0, 50) // Ограничиваем список первыми 50 валютами
          .map(coin => `<option value="${coin.id}">${coin.name} (${coin.symbol.toUpperCase()})</option>`)
          .join('');
      } catch (error) {
        console.error('Ошибка при загрузке списка криптовалют:', error);
        select.innerHTML = '<option>Ошибка загрузки...</option>';
      }
    }

    // Загрузка данных о криптовалюте
    async function fetchCryptoData(crypto) {
      try {
        const response = await fetch(`${API_BASE}/coins/${crypto}/market_chart?vs_currency=usd&days=30`);
        const data = await response.json();
        return data;
      } catch (error) {
        console.error('Ошибка при загрузке данных о криптовалюте:', error);
        resultDiv.innerHTML = `<p class="text-red-500">Ошибка при загрузке данных. Попробуйте позже.</p>`;
      }
    }

    // Построение графика цен
    function renderChart(prices) {
      const labels = prices.map((_, index) => `Day ${index + 1}`);
      const data = prices.map(price => price[1]);

      if (chartInstance) {
        chartInstance.destroy(); // Уничтожаем старый график, если он существует
      }

      chartInstance = new Chart(chartCanvas, {
        type: 'line',
        data: {
          labels: labels,
          datasets: [
            {
              label: 'Цена (USD)',
              data: data,
              backgroundColor: 'rgba(59, 130, 246, 0.2)',
              borderColor: 'rgba(59, 130, 246, 1)',
              borderWidth: 2,
              fill: true,
            },
          ],
        },
        options: {
          responsive: true,
          plugins: {
            legend: {
              display: false,
            },
          },
        },
      });
    }

    // Анализ с помощью TensorFlow.js
    async function analyzeWithNeuralNetwork(prices) {
      // Подготовка данных для нейросети
      const data = prices.map(price => price[1]);
      const inputs = tf.tensor(data.slice(0, -1)); // Все кроме последнего дня
      const targets = tf.tensor(data.slice(1)); // Все кроме первого дня (на один шаг вперёд)

      // Создание простой модели
      const model = tf.sequential();
      model.add(tf.layers.dense({ units: 10, activation: 'relu', inputShape: [1] }));
      model.add(tf.layers.dense({ units: 1 }));

      model.compile({ optimizer: 'adam', loss: 'meanSquaredError' });

      // Тренировка модели
      await model.fit(inputs.reshape([inputs.size, 1]), targets.reshape([targets.size, 1]), {
        epochs: 50,
      });

      // Прогноз
      const prediction = model.predict(tf.tensor([data[data.length - 1]]).reshape([1, 1]));
      const predictedValue = prediction.dataSync()[0];

      return predictedValue > data[data.length - 1]
        ? 'Цена, вероятно, вырастет. Рекомендуется держать или покупать.'
        : 'Цена, вероятно, снизится. Рекомендуется продавать.';
    }

    // Обработчик кнопки
    button.addEventListener('click', async () => {
      const crypto = select.value;
      if (!crypto) {
        resultDiv.innerHTML = `<p class="text-red-500">Выберите криптовалюту.</p>`;
        return;
      }

      resultDiv.innerHTML = '<p class="text-gray-500">Загрузка данных...</p>';
      const data = await fetchCryptoData(crypto);

      if (data) {
        // График
        renderChart(data.prices);

        // Анализ
        const advice = await analyzeWithNeuralNetwork(data.prices);

        // Результаты
        resultDiv.innerHTML = `
          <h2 class="text-xl font-bold">${crypto.toUpperCase()}</h2>
          <p>${advice}</p>
        `;
      }
    });

    // Инициализация
    loadCryptos();
  </script>
</body>
</html>