hqchart 1.1.14108 → 1.1.14115

package/src/jscommon/umychart.vue/umychart.vue.js

@@ -13991,7 +13991,7 @@ function JSChartContainer(uielement, OffscreenElement, cacheElement)
                     if (srcParam) 
                     {
                         this.DestroyPopMinuteChart();
-                        this.InitalPopMinuteChart( {KLine:{KLineDoubleClick:true}} );
+                        this.InitalPopMinuteChart( { PopMinuteChart:{ Enable:true }} );
                     }
                     else 
                     {
@@ -72718,6 +72718,9 @@ function JSChartResource()
     {
         BGColor:"rgba(250,250,250,0.95)",
         BorderColor:"rgb(0,0,0)",
+
+        TitleColor:'rgb(250,250,250)',       //标题颜色
+        TitleBGColor:"rgb(200, 66, 69)",    //标题背景颜色
     }
 
     this.SelectRectBGColor="rgba(1,130,212,0.06)"; //背景色
@@ -74219,6 +74222,8 @@ function JSChartResource()
             var item=style.PopMinuteChart;
             if (item.BGColor) this.PopMinuteChart.BGColor=item.BGColor;
             if (item.BorderColor) this.PopMinuteChart.BorderColor=item.BorderColor;
+            if (item.TitleColor) this.DialogSearchIndex.TitleColor=item.TitleColor;
+            if (item.TitleBGColor) this.DialogSearchIndex.TitleBGColor=item.TitleBGColor;
         }
 
         if (style.DefaultTextColor) this.DefaultTextColor = style.DefaultTextColor;
@@ -77390,9 +77395,16 @@ function KLineChartContainer(uielement,OffscreenElement, cacheElement)
 
     this.InitalPopMinuteChart=function(option)
     {
-        if (!option || !option.KLine) return false;
-        var item=option.KLine;
-        if (item.KLineDoubleClick===true)
+        if (!option) return false;
+
+        if (option.PopMinuteChart && option.PopMinuteChart.Enable)  //新的配置格式
+        {
+            var item=option.PopMinuteChart;
+            this.PopMinuteChart=new JSPopMinuteChart();
+            this.PopMinuteChart.Inital(this, item);
+            return true;
+        }
+        else if (option.KLine && option.KLine.KLineDoubleClick===true)  //旧的格式 不要使用了
         {
             this.PopMinuteChart=new JSPopMinuteChart();
             this.PopMinuteChart.Inital(this);
@@ -124728,7 +124740,7 @@ function GetBlackStyle()
 
         PopMinuteChart:
         {
-            BGColor:"rgba(0,0,0,0.95)",
+            BGColor:"rgba(0,0,0,0.85)",
             BorderColor:"rgb(230,230,230)",
         },
     
@@ -127143,6 +127155,11 @@ function JSReportChart(divElement)
             this.CreateExtraCanvasElement(JSReportChart.TooltipCursorCanvasKey, { ZIndex:99 });
         }
 
+        if (option.MinuteChartTooltip && option.MinuteChartTooltip.Enable)
+        {
+            chart.InitalMinuteChartTooltip(option.MinuteChartTooltip);
+        }
+
         if (option.Symbol) chart.Symbol=option.Symbol;
         if (option.Name) chart.Name=option.Name;
 
@@ -127465,6 +127482,9 @@ function JSReportChartContainer(uielement)
     this.JSPopMenu;             //内置菜单
     this.IsShowRightMenu=true;
 
+    //
+    this.TooltipMinuteChart;    //分时图
+
     //MouseOnStatus:{ RowIndex:行, ColumnIndex:列} 
     this.LastMouseStatus={ MoveStatus:null, TooltipStatus:null, MouseOnStatus:null };
    
@@ -127472,6 +127492,8 @@ function JSReportChartContainer(uielement)
     {
         this.IsDestroy=true;
         this.StopAutoUpdate();
+
+        this.DestroyMinuteChartTooltip();
     }
 
     this.StopAutoDragScrollTimer=function()
@@ -127493,6 +127515,48 @@ function JSReportChartContainer(uielement)
         this.JSPopMenu.Inital();
     }
 
+    this.InitalMinuteChartTooltip=function(option)
+    {
+        if (this.TooltipMinuteChart) return;
+
+        this.TooltipMinuteChart=new JSTooltipMinuteChart();
+        this.TooltipMinuteChart.Inital(this, option);
+        this.TooltipMinuteChart.Create();
+    }
+
+    this.DestroyMinuteChartTooltip=function()
+    {
+        if (!this.TooltipMinuteChart) return;
+
+        this.TooltipMinuteChart.Destroy();
+        this.TooltipMinuteChart=null;
+    }
+
+    //data={ Symbol }
+    this.ShowMinuteChartTooltip=function(x,y, data)
+    {
+        if (!this.TooltipMinuteChart) return;
+
+        var rtClient=this.UIElement.getBoundingClientRect();
+        var rtScroll=GetScrollPosition();
+
+        var offsetLeft=rtClient.left+rtScroll.Left;
+        var offsetTop=rtClient.top+rtScroll.Top;
+
+        data.Offset={ Left:offsetLeft, Top:offsetTop };
+
+        this.TooltipMinuteChart.Show(data, x,y);
+    }
+
+    this.HideMinuteChartTooltip=function()
+    {
+        if (!this.TooltipMinuteChart) return;
+
+        this.TooltipMinuteChart.Hide();
+    }
+
+
+
     this.AutoScrollPage=function(step)
     {
         this.AutoDragScrollTimer=setTimeout(() =>
@@ -128928,6 +128992,9 @@ function JSReportChartContainer(uielement)
         var bDrawTooltip=false;
         if (this.LastMouseStatus.TooltipStatus) bDrawTooltip=true;
         this.LastMouseStatus.TooltipStatus=null;
+
+        var bShowChartTooltip=false;
+        var chartTooltipData=null;
         
         if (this.DragRow) return;
         if (this.DrawHeader) return;
@@ -128998,8 +129065,19 @@ function JSReportChartContainer(uielement)
                 var tooltipData=report.GetTooltipData(x,y);  //单元格提示信息
                 if (tooltipData)
                 {
-                    this.LastMouseStatus.TooltipStatus={ X:x, Y:y, Data:tooltipData, ClientX:e.clientX, ClientY:e.clientY };
-                    bDrawTooltip=true;
+                    if (tooltipData.Type==20)
+                    {
+                        if (tooltipData.Stock && tooltipData.Stock.Symbol)
+                        {
+                            bShowChartTooltip=true;
+                            chartTooltipData={ Symbol:tooltipData.Stock.OriginalSymbol, Rect:tooltipData.Rect };
+                        }
+                    }
+                    else
+                    {
+                        this.LastMouseStatus.TooltipStatus={ X:x, Y:y, Data:tooltipData, ClientX:e.clientX, ClientY:e.clientY };
+                        bDrawTooltip=true;
+                    }
                 }
             }
 
@@ -129030,6 +129108,15 @@ function JSReportChartContainer(uielement)
 
         if (bDraw || bDrawTab) this.Draw();
         else if (bDrawTooltip) this.DrawTooltip(this.LastMouseStatus.TooltipStatus);
+
+        if (bShowChartTooltip)
+        {
+            this.ShowMinuteChartTooltip(null, null, chartTooltipData);
+        }
+        else
+        {
+            this.HideMinuteChartTooltip();
+        }
     }
 
     this.UIOnMounseOut=function(e)
@@ -131480,7 +131567,7 @@ function ChartReport()
     this.RectClient={};
 
     //{ Rect:rtItem, Stock:stock, Index:index, Column:column, RowType:rowType, Type:drawInfo.Tooltip.Type, Data:{ AryText:[ {Text:xx} ]} };
-    //Type:1=数据截断
+    //Type:1=数据截断 2=表头提示信息  20=分时图
     // { Text, Color, Title:, TitleColor, Space, Margin:{ Left, Top, Right, Bottom }}
     this.TooltipRect=[];
 
@@ -131614,6 +131701,7 @@ function ChartReport()
             if (IFrameSplitOperator.IsNumber(item.ColorType))  colItem.ColorType=item.ColorType;        //0=默认 1=(>0, =0, <0) 2=(>=0, <0)
             else colItem.IsDrawCallback=false;
             if (item.Icon) colItem.Icon=item.Icon;
+            if (IFrameSplitOperator.IsBool(item.EnableChartTooltip)) colItem.EnableChartTooltip=item.EnableChartTooltip;
 
             //点击表头弹出菜单
             if (IFrameSplitOperator.IsBool(item.EnablePopupHeaderMenu)) colItem.EnablePopupHeaderMenu=item.EnablePopupHeaderMenu;
@@ -133053,12 +133141,19 @@ function ChartReport()
             var tooltipData={ Rect:rtItem, Stock:stock, Index:index, Column:column, RowType:rowType, Type:drawInfo.Tooltip.Type, Data:drawInfo.Tooltip.Data };
             this.TooltipRect.push(tooltipData);
         }
+        else if (column.EnableChartTooltip)
+        {
+            var tooltipData={ Rect:rtItem, Stock:stock, Index:index, Column:column, RowType:rowType, Type:20 };
+            this.TooltipRect.push(tooltipData);
+        }
 
         if (drawInfo.Botton)
         {
             var buttonData={ Stock:stock, Index:index, ColumnIndex:columnIndex, Column:column, Rect:drawInfo.Botton.Rect, Type:drawInfo.Botton.Type, Data:drawInfo.Data };
             this.ButtonRect.push(buttonData);
         }
+
+       
     }
 
     this.IsReserveProgressBarColumn=function(value)
@@ -143550,12 +143645,17 @@ function JSDialogModifyDraw()
 function JSPopMinuteChart()
 {
     this.DivDialog=null;
-    this.DivInfoText=null;
+    this.TitleBox=null; //{ DivTitle, DivName, DivName }
     this.HQChart=null;
     this.DragTitle=null;
     this.Date=null;
     this.ID=Guid();
 
+    this.TitleColor=g_JSChartResource.PopMinuteChart.TitleColor;
+    this.TitleBGColor=g_JSChartResource.PopMinuteChart.TitleBGColor;
+    this.BGColor=g_JSChartResource.PopMinuteChart.BGColor;
+    this.BorderColor=g_JSChartResource.PopMinuteChart.BorderColor;
+
     this.Minute=
     {
         Option:JSPopMinuteChart.GetMinuteOption(),
@@ -143563,9 +143663,18 @@ function JSPopMinuteChart()
         Date:null,
     }
 
-    this.Inital=function(hqchart)
+    this.Inital=function(hqchart, option)
     {
         this.HQChart=hqchart;
+
+        if (option)
+        {
+            if (IFrameSplitOperator.IsObject(option.Option)) 
+            {
+                var item=CloneData(option.Option);  //复制一份出来
+                this.Minute.Option=Object.assign(this.Minute.Option,item);
+            }
+        }
     }
 
     this.Create=function()
@@ -143573,8 +143682,6 @@ function JSPopMinuteChart()
         var divDom=document.createElement('div');
         divDom.className='jchart_pop_minute_dailog';
         divDom.id=this.ID;
-        divDom.style["background-color"]=g_JSChartResource.PopMinuteChart.BGColor;
-        divDom.style["border-color"]=g_JSChartResource.PopMinuteChart.BorderColor;
 
         var divTitle=document.createElement("div");
         divTitle.className='jschart_pop_minute_chart_Title_Div';
@@ -143598,6 +143705,7 @@ function JSPopMinuteChart()
         divChart.className='jschart_pop_minute_chart';
         divDom.appendChild(divChart);
 
+        this.TitleBox={ DivTitle:divTitle, DivName:divInfoText, DivColor:divClose };
         this.DivDialog=divDom;
 
         var chart=JSChart.Init(divChart);
@@ -143609,6 +143717,19 @@ function JSPopMinuteChart()
         chart.SetOption(this.Minute.Option);  //设置K线配置
 
         document.body.appendChild(divDom);
+
+        this.UpdateStyle();
+    }
+
+    this.UpdateStyle=function()
+    {
+        if (!this.DivDialog) return;
+
+        if (this.BGColor) this.DivDialog.style['background-color']=this.BGColor;
+        if (this.BorderColor) this.DivDialog.style['border-color']=this.BorderColor;
+
+        if (this.TitleBGColor) this.TitleBox.DivTitle.style['background-color']=this.TitleBGColor;
+        if (this.TitleColor) this.TitleBox.DivName.style['color']=this.TitleColor;
     }
 
     this.NetworkFilter=function(data, callback)
@@ -143636,7 +143757,7 @@ function JSPopMinuteChart()
     {
         if (this.DivDialog) document.body.removeChild(this.DivDialog);
         this.DivDialog=null;
-        this.DivInfoText=null;
+        this.TitleBox=null;
         this.Minute.JSChart=null;
     }
 
@@ -143656,7 +143777,7 @@ function JSPopMinuteChart()
         var name=data.Symbol;
         if (data.Name) name=data.Name;
         var title=`${name} ${IFrameSplitOperator.FormatDateString(data.Date)} 分时图`
-        this.DivInfoText.innerText=title;
+        this.TitleBox.DivName.innerText=title;
 
         if (this.Minute.JSChart)
         {
@@ -143724,10 +143845,14 @@ function JSPopMinuteChart()
 
     this.ReloadResource=function(option)
     {
+        this.TitleColor=g_JSChartResource.PopMinuteChart.TitleColor;
+        this.TitleBGColor=g_JSChartResource.PopMinuteChart.TitleBGColor;
+        this.BGColor=g_JSChartResource.PopMinuteChart.BGColor;
+        this.BorderColor=g_JSChartResource.PopMinuteChart.BorderColor;
+
         if (!this.DivDialog) return;
 
-        this.DivDialog.style["background-color"]=g_JSChartResource.PopMinuteChart.BGColor;
-        this.DivDialog.style["border-color"]=g_JSChartResource.PopMinuteChart.BorderColor;
+        this.UpdateStyle();
 
         if (this.Minute.JSChart) this.Minute.JSChart.ReloadResource(option);
     }
@@ -143812,6 +143937,243 @@ JSPopMinuteChart.GetMinuteOption=function()
 }
 
 
+///////////////////////////////////////////////////////
+//  分时图提示信息
+//
+//////////////////////////////////////////////////////
+
+function JSTooltipMinuteChart()
+{
+    this.DivDialog=null;
+    this.HQChart=null;
+    this.ID=Guid();
+
+    this.BGColor=g_JSChartResource.PopMinuteChart.BGColor;
+    this.BorderColor=g_JSChartResource.PopMinuteChart.BorderColor;
+
+    this.Minute=
+    {
+        Option:JSTooltipMinuteChart.GetMinuteOption(),
+        JSChart:null,
+        Symbol:null,
+        Date:null,
+    }
+
+    this.Inital=function(hqchart, option)
+    {
+        this.HQChart=hqchart;
+
+        if (option)
+        {
+            if (IFrameSplitOperator.IsObject(option.Option)) 
+            {
+                var item=CloneData(option.Option);  //复制一份出来
+                this.Minute.Option=Object.assign(this.Minute.Option,item);
+            }
+        }
+    }
+
+    this.Create=function()
+    {
+        var divDom=document.createElement('div');
+        divDom.className='UMyChart_Tooltip_Minute_Div';
+        divDom.id=this.ID;
+
+        var divChart=document.createElement('div');
+        divChart.className='UMyChart_Tooltip_Minute_Chart_Div';
+        divDom.appendChild(divChart);
+
+        this.DivDialog=divDom;
+
+        var chart=JSChart.Init(divChart);
+        this.Minute.JSChart=chart;
+
+        //语言跟主图保持一致
+        if (this.HQChart) this.Minute.Option.Language=g_JSChartLocalization.GetLanguageName(this.HQChart.LanguageID);
+        this.Minute.Option.OnCreatedCallback=(chart)=>{ this.OnCreateHQChart(chart); }
+        this.Minute.Option.NetworkFilter=(data, callback)=>{ this.NetworkFilter(data, callback); }
+        chart.SetOption(this.Minute.Option);  //设置K线配置
+
+        document.body.appendChild(divDom);
+
+        this.UpdateStyle();
+    }
+
+    this.UpdateStyle=function()
+    {
+        if (!this.DivDialog) return;
+
+        if (this.BGColor) this.DivDialog.style['background-color']=this.BGColor;
+        if (this.BorderColor) this.DivDialog.style['border-color']=this.BorderColor;
+    }
+
+    this.NetworkFilter=function(data, callback)
+    {
+        if (!this.HQChart || !this.HQChart.NetworkFilter) return;
+
+        /*
+        if (data) data.PopMinuteData={ Date:this.Date };    //弹出分时图额外数据
+        
+        if (data.Name== 'MinuteChartContainer::RequestMinuteData')  //分时图数据对接
+        {
+            data.Request.Data.date=this.Date;
+            data.Name="MinuteChartContainer::RequestPopMinuteData";
+            data.Explain="指定日期分时数据"
+        };
+        */
+
+        this.HQChart.NetworkFilter(data, callback);       
+    }
+
+    this.OnCreateHQChart=function(chart)
+    {
+
+    }
+
+    this.Destroy=function()
+    {
+        if (this.DivDialog) document.body.removeChild(this.DivDialog);
+        this.DivDialog=null;
+        this.TitleBox=null;
+        if (!this.Minute.JSChart) this.Minute.JSChart.ChartDestory();
+        this.Minute.JSChart=null;
+    }
+
+    this.IsShow=function()
+    {
+        if (!this.DivDialog) return false;
+        
+        return this.DivDialog.style.visibility==='visible';
+    }
+
+    this.Show=function(data, x, y)
+    {
+        if (!this.DivDialog) this.Create();
+        if (!data || !data.Symbol) return;
+
+        var symbol=data.Symbol;
+        var date=null;
+        if (IFrameSplitOperator.IsPlusNumber(data.Date)) date=data.Date;
+
+        if (this.Minute.JSChart)
+        {
+            if (this.Minute.Symbol!=symbol || this.Minute.Date!=date)
+            {
+                this.Minute.Symbol=symbol;
+                this.Minute.Date=date;
+                this.Minute.JSChart.ChangeSymbol(symbol);
+            }
+        }
+
+        if (IFrameSplitOperator.IsNumberV2(x,y))
+        {
+
+        }
+        else if (data.Rect)
+        {
+            var rtCell=data.Rect;
+            var pixelRatio=GetDevicePixelRatio();
+            var rtItem={ Left:rtCell.Left/pixelRatio, Right:rtCell.Right/pixelRatio, Bottom:rtCell.Bottom/pixelRatio, Top:rtCell.Top/pixelRatio };
+            rtItem.Width=rtItem.Right-rtItem.Left;
+            rtItem.Height=rtItem.Bottom-rtItem.Top;
+
+            //超出窗口调整位置
+            var height=this.DivDialog.offsetHeight;
+            var width=this.DivDialog.offsetWidth;
+            var x=rtItem.Right+data.Offset.Left;
+            var y=rtItem.Bottom+data.Offset.Top;
+
+            var xRight=window.innerWidth-5;
+            var ybottom=window.innerHeight-5;
+            if (x+width>xRight) x=xRight-width;
+            if (y+height>ybottom) y=(rtItem.Top+data.Offset.Top)-height;
+
+            this.DivDialog.style.visibility='visible';
+            this.DivDialog.style.top = y + "px";
+            this.DivDialog.style.left = x + "px";
+        }
+    }
+
+    this.Hide=function()
+    {
+        if (!this.DivDialog) return;
+        if (this.DivDialog.style.visibility!='hidden')
+            this.DivDialog.style.visibility='hidden';
+    }
+
+}
+
+JSTooltipMinuteChart.GetMinuteOption=function()
+{
+    var option=
+    {
+        Type:'分钟走势图',   //创建图形类型
+        Windows: //窗口指标
+        [
+            //{ Index:"VOL" },
+            //{ Index:"RSI" }
+        ], 
+                
+        Symbol:null,         // cf1909.czc
+        IsAutoUpdate:false,          //是自动更新数据
+        AutoUpdateFrequency:10000,   //数据更新频率
+        DayCount:1,                     //1 最新交易日数据 >1 多日走势图
+        IsShowRightMenu:false,       //是否显示右键菜单
+        
+        EnableSelectRect:true,
+        EnableZoomIndexWindow:true,
+        EnableResize:true,
+
+        //BeforeOpen:{IsShow:true, Width:120, IsShowMultiDay:true, MulitiDayWidth:100, },
+        //AfterClose:{IsShow:true, Width:100, IsShowMultiDay:true, MulitiDayWidth:50,  ShareVol:2 }, //ShareVol:0=盘后成交量独立坐标, 1==盘后成交量主图共用 2==盘后成交量盘前共用
+
+        CorssCursorInfo:{ Left:2, Right:1, Bottom:1 },
+                
+        MinuteLine:
+        {
+           
+        },
+
+        MinuteTitle:
+        {
+            IsShowTime:true,
+            IsShowName:true,
+            IsShowDate:true,
+            IsShowVolTitle:true,
+            //IsAlwaysShowLastData:true,
+            IsTitleShowLatestData:true,
+        },
+
+        MinuteVol:
+        {
+            BarColorType:1,
+        },
+
+        //Language:'EN',
+    
+        Border: //边框
+        {
+            Left:20,    //左边间距
+            Right:120,     //右边间距
+            Top:25,
+            Bottom:25,
+
+            AutoLeft:{ Blank:10, MinWidth:40 },
+            AutoRight:{ Blank:10, MinWidth:40 },
+        },
+                
+        Frame:  //子框架设置
+        [
+            { SplitCount:5 },
+            { SplitCount:3 },
+            { SplitCount:3 },
+        ],
+    }
+
+    return option;
+}
+
+
 
 /*
    Copyright (c) 2018 jones
@@ -145202,7 +145564,7 @@ function JSFloatTooltip()
         }
     }
 
-    this.Show=function(x, y)
+    this.Show=function(x, y, option)
     {
         if (!this.DivDialog) return;
         if (!this.HQChart) return;
@@ -145213,7 +145575,11 @@ function JSFloatTooltip()
         var bottom=top+this.DivDialog.offsetHeight;
         
         if ((right+5)>=window.innerWidth) left=left-this.DivDialog.offsetWidth;
-        if ((bottom+5)>=window.innerHeight) top=window.innerHeight-this.DivDialog.offsetHeight-5;
+        if ((bottom+5)>=window.innerHeight) 
+        {
+            top=(y+rtClient.top)-this.DivDialog.offsetHeight;
+            if (option && IFrameSplitOperator.IsNumber(option.YMove)) top-=option.YMove;
+        }
        
         this.DivDialog.style.top = top + "px";
         this.DivDialog.style.left = left + "px";
@@ -145433,7 +145799,7 @@ function JSFloatTooltip()
         {
             var x=data.Point.X;
             var y=data.Point.Y+data.Point.YMove;
-            this.Show(x, y);
+            this.Show(x, y, { YMove:data.Point.YMove });
         }
     }
 
@@ -148268,7 +148634,7 @@ function HQChartScriptWorker()
 
 
 
-var HQCHART_VERSION="1.1.14107";
+var HQCHART_VERSION="1.1.14114";
 
 function PrintHQChartVersion()
 {