jack/Chan
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Web 加上资金面/情绪叠图，并收紧默认图面。

Browse Source 
默认主/次/次次改为 45m/15m/5m、开始时间一周；SD/CD 按 hist 摆位置和箭头；去掉笔线段背驰与第四类勾选。

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
jackyu66git
2026-09-12 02:25:44 +08:00
co-authored by Cursor
parent b301ad22c9
commit c22cd48f36
24 changed files with 1200 additions and 306 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/static/js/app/chart_tv_shell.js
+95 -26
View File
@@ -77,6 +77,7 @@ function chartTvBuildShell(ctx) {
mainChart: null,
volumeChart: null,
macdChart: null,
sentimentChart: null,
series: {
candleSeries: null,
lineSeries: null,
@@ -125,6 +126,7 @@ function chartTvBuildShell(ctx) {
// 是否显示MACD
const showMacd = $('#showMacd').is(':checked');
const showOriginalKline = $('#showOriginalKline').is(':checked');
const showSentiment = ($('#dataSource').val() || 'crypto') === 'crypto' && $('#showDeriv').is(':checked');
// 创建主图容器
const mainChartContainer = document.createElement('div');
@@ -153,25 +155,20 @@ function chartTvBuildShell(ctx) {
// 如果需要显示MACD，创建MACD容器
let macdChartContainer = null;
let chanMacdChartContainer = null;
if (showMacd) {
// 仅显示新的 ChanMACD 图：让其占用原 MACD+ChanMACD 的整体高度
// 新布局：主图(40%) → ChanMACD(30%) → 成交量(17.5%) → ATR(12.5%)
mainChartContainer.style.height = '40%';
// 隐藏旧 MACD 容器（不创建）
// 创建 ChanMACD 容器占据原 MACD+ChanMACD 高度（30%）
let sentimentChartContainer = null;
if (showMacd && showSentiment) {
mainChartContainer.style.height = '34%';
chanMacdChartContainer = document.createElement('div');
chanMacdChartContainer.style.width = '100%';
chanMacdChartContainer.style.height = '30%';
chanMacdChartContainer.style.height = 'calc(22% - 50px)';
chanMacdChartContainer.style.position = 'absolute';
chanMacdChartContainer.style.top = '40%';
chanMacdChartContainer.style.top = '34%';
chanMacdChartContainer.style.left = '0';
chanMacdChartContainer.style.right = '0';
chanMacdChartContainer.style.borderTop = '1px solid #e0e0e0';
chanMacdChartContainer.style.zIndex = '10';
// 水印：便于区分是新的 ChanMACD 子图
const chanMacdWatermark = document.createElement('div');
chanMacdWatermark.textContent = 'ChanMACD';
chanMacdWatermark.textContent = 'MACD';
chanMacdWatermark.style.position = 'absolute';
chanMacdWatermark.style.top = '4px';
chanMacdWatermark.style.left = '8px';
@@ -179,31 +176,81 @@ function chartTvBuildShell(ctx) {
chanMacdWatermark.style.color = '#888';
chanMacdWatermark.style.pointerEvents = 'none';
chanMacdChartContainer.appendChild(chanMacdWatermark);
// 成交量位于 ChanMACD 之下
volumeChartContainer.style.top = '70%';
volumeChartContainer.style.height = '17.5%';
// ATR 位于最底部
atrChartContainer.style.top = '87.5%';
atrChartContainer.style.height = '12.5%';
volumeChartContainer.style.top = 'calc(56% - 50px)';
volumeChartContainer.style.height = 'calc(12% + 20px)';
atrChartContainer.style.top = 'calc(68% - 30px)';
atrChartContainer.style.height = 'calc(10% - 20px)';
} else if (showMacd) {
mainChartContainer.style.height = '40%';
chanMacdChartContainer = document.createElement('div');
chanMacdChartContainer.style.width = '100%';
chanMacdChartContainer.style.height = 'calc(30% - 50px)';
chanMacdChartContainer.style.position = 'absolute';
chanMacdChartContainer.style.top = '40%';
chanMacdChartContainer.style.left = '0';
chanMacdChartContainer.style.right = '0';
chanMacdChartContainer.style.borderTop = '1px solid #e0e0e0';
chanMacdChartContainer.style.zIndex = '10';
const chanMacdWatermark = document.createElement('div');
chanMacdWatermark.textContent = 'MACD';
chanMacdWatermark.style.position = 'absolute';
chanMacdWatermark.style.top = '4px';
chanMacdWatermark.style.left = '8px';
chanMacdWatermark.style.fontSize = '11px';
chanMacdWatermark.style.color = '#888';
chanMacdWatermark.style.pointerEvents = 'none';
chanMacdChartContainer.appendChild(chanMacdWatermark);
volumeChartContainer.style.top = 'calc(70% - 50px)';
volumeChartContainer.style.height = 'calc(17.5% + 20px)';
atrChartContainer.style.top = 'calc(87.5% - 30px)';
atrChartContainer.style.height = 'calc(12.5% - 20px)';
} else if (showSentiment) {
mainChartContainer.style.height = '48%';
volumeChartContainer.style.top = '48%';
volumeChartContainer.style.height = '14%';
atrChartContainer.style.top = '62%';
atrChartContainer.style.height = '12%';
} else {
// 不显示MACD时的高度 - 主图、成交量图和ATR图分配
mainChartContainer.style.height = '55%'; // 主图占55%
mainChartContainer.style.height = '55%';
volumeChartContainer.style.top = '55%';
volumeChartContainer.style.height = '22.5%'; // 成交量图占22.5%
atrChartContainer.style.top = '77.5%'; // ATR图从77.5%位置开始
atrChartContainer.style.height = '22.5%'; // ATR图占22.5%
volumeChartContainer.style.height = '22.5%';
atrChartContainer.style.top = '77.5%';
atrChartContainer.style.height = '22.5%';
}
if (showSentiment) {
sentimentChartContainer = document.createElement('div');
sentimentChartContainer.style.width = '100%';
sentimentChartContainer.style.position = 'absolute';
sentimentChartContainer.style.left = '0';
sentimentChartContainer.style.right = '0';
sentimentChartContainer.style.borderTop = '1px solid #e0e0e0';
if (showMacd) {
sentimentChartContainer.style.top = '78%';
sentimentChartContainer.style.height = '22%';
} else {
sentimentChartContainer.style.top = '74%';
sentimentChartContainer.style.height = '26%';
}
const sentimentWatermark = document.createElement('div');
sentimentWatermark.textContent = '衍生品 买卖比 / 多空 / 大户 / 费率';
sentimentWatermark.style.position = 'absolute';
sentimentWatermark.style.top = '4px';
sentimentWatermark.style.left = '8px';
sentimentWatermark.style.fontSize = '11px';
sentimentWatermark.style.color = '#888';
sentimentWatermark.style.pointerEvents = 'none';
sentimentChartContainer.appendChild(sentimentWatermark);
}
container.appendChild(mainChartContainer);
container.appendChild(volumeChartContainer);
container.appendChild(atrChartContainer);
if (showMacd) {
// 只追加新的 ChanMACD 容器
container.appendChild(chanMacdChartContainer);
}
if (showSentiment && sentimentChartContainer) {
container.appendChild(sentimentChartContainer);
}
// 防止同步过程中的无限循环（实际同步由 bindSyncEvents 负责）
@@ -221,6 +268,8 @@ function chartTvBuildShell(ctx) {
chartHeight = macdChartContainer ? macdChartContainer.clientHeight : 0;
} else if (chartType === 'chanmacd') {
chartHeight = chanMacdChartContainer ? chanMacdChartContainer.clientHeight : 0;
} else if (chartType === 'sentiment') {
chartHeight = sentimentChartContainer ? sentimentChartContainer.clientHeight : 0;
} else {
chartHeight = mainChartContainer.clientHeight;
}
@@ -376,9 +425,26 @@ function chartTvBuildShell(ctx) {
// 创建MACD图表（如果需要）：仅创建新的 ChanMACD 图
let macdChart = null;
let chanMacdChart = null;
let sentimentChart = null;
if (showMacd) {
chanMacdChart = LightweightCharts.createChart(chanMacdChartContainer, createChartOptions(false, 'chanmacd'));
}
if (showSentiment && sentimentChartContainer) {
sentimentChart = LightweightCharts.createChart(sentimentChartContainer, createChartOptions(false, 'sentiment'));
if (candles.length) {
const axisSeries = sentimentChart.addLineSeries({
priceScaleId: '__time',
color: 'rgba(0,0,0,0)',
lineWidth: 0,
lastValueVisible: false,
priceLineVisible: false,
crosshairMarkerVisible: false
});
sentimentChart.priceScale('__time').applyOptions({ visible: false });
axisSeries.setData(candles.map(function (c) { return { time: c.time, value: 0 }; }));
tvWidget.series.sentimentAxisSeries = axisSeries;
}
}
// 创建主价格系列并设置数据（支持多种图表类型）
(function(){
@@ -495,10 +561,13 @@ function chartTvBuildShell(ctx) {
ctx.atrChartContainer = atrChartContainer;
ctx.macdChartContainer = macdChartContainer;
ctx.chanMacdChartContainer = chanMacdChartContainer;
ctx.sentimentChartContainer = sentimentChartContainer;
ctx.showSentiment = showSentiment;
ctx.mainChart = mainChart;
ctx.volumeChart = volumeChart;
ctx.atrChart = atrChart;
ctx.macdChart = macdChart;
ctx.chanMacdChart = chanMacdChart;
ctx.sentimentChart = sentimentChart;
ctx.createChartOptions = createChartOptions;
}