divers
This commit is contained in:
@@ -90,7 +90,14 @@ function renderChart(data, filename, create_columns) {
|
||||
// }
|
||||
const cols = Object.keys(data[0])
|
||||
if (create_columns === true) {
|
||||
string = "<ul class='indicators'>" + Object.keys(data[0]).map(cols => `<li><label><input id="${cols}" type="checkbox" value="${cols}" onchange="toggleIndicator(this)">${cols}</label></li>`).join('') + "</ul>"
|
||||
// string = "<ul class='indicators'>" + Object.keys(data[0]).map(cols => `<li><label><input id="${cols}" type="checkbox" value="${cols}" onchange="toggleIndicator(this)">${cols}</label></li>`).join('') + "</ul>"
|
||||
string = "<ul class='indicators'>" +
|
||||
Object.keys(data[0])
|
||||
.filter(key => !['date', 'open', 'close', 'volume', 'high', 'low'].includes(key))
|
||||
.map(cols => `<li><label><input id="${cols}" type="checkbox" value="${cols}" onchange="toggleIndicator(this)">${cols}</label></li>`)
|
||||
.join('') +
|
||||
"</ul>";
|
||||
|
||||
const indicators = document.getElementById('indicators');
|
||||
indicators.innerHTML = string
|
||||
}
|
||||
@@ -130,21 +137,36 @@ function renderChart(data, filename, create_columns) {
|
||||
// df_ohlc = data
|
||||
// df_ohlc['date'] = pd.to_datetime(data['date']).dt.strftime('%Y-%m-%d')
|
||||
// df_ohlc = data[['date', 'open', 'close', 'low', 'high']]
|
||||
// series.push({
|
||||
// type: 'candlestick',
|
||||
// data: {
|
||||
// 'dates': df_ohlc['date'].tolist(),
|
||||
// 'ohlc': df_ohlc[['open', 'close', 'low', 'high']].values.tolist()
|
||||
// },
|
||||
// itemStyle: {
|
||||
// color: '#ec0000', // bougie haussière (fermée plus haut que ouverte)
|
||||
// color0: '#00da3c', // bougie baissière
|
||||
// borderColor: '#8A0000',
|
||||
// borderColor0: '#008F28'
|
||||
// }
|
||||
// }
|
||||
// )
|
||||
const result = data.map(({ open, close, low, high }) => [open, close, low, high]);
|
||||
|
||||
series.push({
|
||||
type: 'candlestick',
|
||||
data: result,
|
||||
itemStyle: {
|
||||
color: '#ec0000', // bougie haussière (fermée plus haut que ouverte)
|
||||
color0: '#00da3c', // bougie baissière
|
||||
borderColor: '#8A0000',
|
||||
borderColor0: '#008F28'
|
||||
}
|
||||
}
|
||||
)
|
||||
// console.log(result)
|
||||
|
||||
series.push({
|
||||
name: 'Volume',
|
||||
type: 'bar',
|
||||
xAxisIndex: 1,
|
||||
yAxisIndex: 1,
|
||||
itemStyle: {
|
||||
color: '#7fbe9e'
|
||||
},
|
||||
emphasis: {
|
||||
itemStyle: {
|
||||
color: '#140'
|
||||
}
|
||||
},
|
||||
data: data.map(d => d.volume)
|
||||
})
|
||||
for (var key in cols) {
|
||||
var value = cols[key];
|
||||
element=document.getElementById(value)
|
||||
@@ -201,18 +223,37 @@ function renderChart(data, filename, create_columns) {
|
||||
legend: {
|
||||
data: cols, // Affiche les noms de chaque série avec leur couleur
|
||||
},
|
||||
xAxis: {
|
||||
xAxis: [{
|
||||
type: 'category',
|
||||
data: data.map(d => {
|
||||
const date = new Date(d.date);
|
||||
return date.toLocaleDateString('fr-FR'); // ex : 07/05/2025
|
||||
})
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
min: 'dataMin', // <-- commence à la plus petite valeur
|
||||
max: 'dataMax' // <-- adapte aussi le maximum
|
||||
},
|
||||
{
|
||||
type: 'category',
|
||||
data: data.map(d => {
|
||||
const date = new Date(d.date);
|
||||
return date.toLocaleDateString('fr-FR'); // ex : 07/05/2025
|
||||
}),
|
||||
gridIndex: 1
|
||||
}
|
||||
],
|
||||
yAxis: [{
|
||||
type: 'value',
|
||||
min: 'dataMin', // <-- commence à la plus petite valeur
|
||||
max: 'dataMax' // <-- adapte aussi le maximum
|
||||
},
|
||||
{
|
||||
gridIndex: 1,
|
||||
min: 'dataMin', // <-- commence à la plus petite valeur
|
||||
max: 'dataMax' // <-- adapte aussi le maximum
|
||||
}
|
||||
],
|
||||
grid: [
|
||||
{ left: '10%', right: '8%', height: '70%' },
|
||||
{ left: '10%', right: '8%', top: '80%', height: '10%' }
|
||||
],
|
||||
series: series
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user