hqchart 1.1.13370 → 1.1.13381

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

@@ -6090,6 +6090,7 @@ function JSChart(divElement, bOffscreen, bCacheCanvas)
 JSChart.LastVersion=null;   //最新的版本号
 JSChart.EnableCanvasWillReadFrequently=false;   //https://html.spec.whatwg.org/multipage/canvas.html#concept-canvas-will-read-frequently
 JSChart.CorssCursorCanvasKey="hqchart_corsscursor";
+JSChart.TooltipCursorCanvasKey="hqchart_tooltip";
 
 //初始化
 JSChart.Init=function(divElement,bScreen,bCacheCanvas)
@@ -6500,6 +6501,7 @@ var JSCHART_OPERATOR_ID=
     OP_SCROOLBAR_SLIDER_CHANGED:15,    //滑块变动
 
     OP_GOTO:16,     //移动到某一个天或某一个分钟
+    OP_GOTO_BY_DATAINDEX:17,   //的移动到某一个数据起始位置
 }
 
 var JSCHART_DRAG_ID=
@@ -14721,15 +14723,21 @@ function AverageWidthFrame()
         if (!text) return;
         
         var pixelRatio=GetDevicePixelRatio();
+        var canvas=this.Canvas;
+        if (this.GetExtraCanvas)
+        {
+            var finder=this.GetExtraCanvas(JSChart.TooltipCursorCanvasKey);
+            if (finder) canvas=finder.Canvas;
+        }
         
         var xCenter=mouseOnToolbar.Rect.Left+mouseOnToolbar.Rect.Width/2;
 
-        this.Canvas.font=this.ButtonTooltip.Font;
-        this.Canvas.textAlign="left";
-        this.Canvas.textBaseline="bottom";
+        canvas.font=this.ButtonTooltip.Font;
+        canvas.textAlign="left";
+        canvas.textBaseline="bottom";
 
         var mergin= this.ButtonTooltip.Mergin;
-        var textWidth=this.Canvas.measureText(text).width+mergin.Left+mergin.Right;
+        var textWidth=canvas.measureText(text).width+mergin.Left+mergin.Right;
         var textHeight=this.GetFontHeight();
         var bgHeight=textHeight+mergin.Top+mergin.Bottom;
         if (mouseOnToolbar.ID=="TitleButton")
@@ -14761,25 +14769,25 @@ function AverageWidthFrame()
         if (IFrameSplitOperator.IsNumber(this.ButtonTooltip.BorderRadius))  //圆角
         {
             var roundRadius=this.ButtonTooltip.BorderRadius;
-            this.Canvas.beginPath();
-            this.Canvas.roundRect(ToFixedPoint(x), ToFixedPoint(y), ToFixedRect(textWidth), ToFixedRect(bgHeight), [roundRadius]);
-            this.Canvas.closePath();
+            canvas.beginPath();
+            canvas.roundRect(ToFixedPoint(x), ToFixedPoint(y), ToFixedRect(textWidth), ToFixedRect(bgHeight), [roundRadius]);
+            canvas.closePath();
 
-            this.Canvas.fillStyle=this.ButtonTooltip.ColorBG;
-            this.Canvas.fill();
+            canvas.fillStyle=this.ButtonTooltip.ColorBG;
+            canvas.fill();
 
-            this.Canvas.strokeStyle=this.ButtonTooltip.ColorBorder;
-            this.Canvas.stroke();
+            canvas.strokeStyle=this.ButtonTooltip.ColorBorder;
+            canvas.stroke();
 
-            this.Canvas.fillStyle=this.ButtonTooltip.Color;
-            this.Canvas.fillText(text, x+mergin.Left, y+bgHeight-mergin.Bottom);
+            canvas.fillStyle=this.ButtonTooltip.Color;
+            canvas.fillText(text, x+mergin.Left, y+bgHeight-mergin.Bottom);
         }
         else
         {
-            this.Canvas.fillStyle=this.ButtonTooltip.ColorBG; 
-            this.Canvas.fillRect(x,y,textWidth,bgHeight);   //画一个背景色, 不然是一个黑的背景
-            this.Canvas.fillStyle=this.ButtonTooltip.Color;
-            this.Canvas.fillText(text, x+mergin.Left,y+bgHeight-mergin.Bottom);
+            canvas.fillStyle=this.ButtonTooltip.ColorBG; 
+            canvas.fillRect(x,y,textWidth,bgHeight);   //画一个背景色, 不然是一个黑的背景
+            canvas.fillStyle=this.ButtonTooltip.Color;
+            canvas.fillText(text, x+mergin.Left,y+bgHeight-mergin.Bottom);
         }
         
 
@@ -73157,6 +73165,29 @@ function KLineChartContainer(uielement,OffscreenElement, cacheElement)
 
             this.ChartOperator_Temp_Update();
         }
+        else if (id==JSCHART_OPERATOR_ID.OP_GOTO_BY_DATAINDEX)  //{PageSize:可选, DataIndex:起始位置数据索引}
+        {
+            if (!IFrameSplitOperator.IsNumber(obj.DataIndex)) return;
+            var hisData=this.ChartOperator_Temp_GetHistroyData();
+            if (!hisData) return;  //数据还没有到达
+            if (obj.DataIndex<0 || obj.DataIndex>=hisData.Data.length)
+            {
+                JSConsole.Chart.Log(`[KLineChartContainer::ChartOperator] OP_GOTO_BY_DATAINDEX obj.DataIndex=${obj.DataIndex} error.}`);
+                return;
+            }
+
+            var oldXPointCount=this.Frame.SubFrame[0].Frame.XPointCount;
+            var xPointCount=oldXPointCount;
+            if (obj.PageSize>0) xPointCount=obj.PageSize; //调整一屏显示的个数
+            if (xPointCount!=oldXPointCount) this.Frame.SetXShowCount(xPointCount);  //设置X轴显示数据个数
+
+            hisData.DataOffset=obj.DataIndex;
+            this.CursorIndex=0;
+            this.LastPoint.X=null;
+            this.LastPoint.Y=null;
+
+            this.ChartOperator_Temp_Update();
+        }
         else if (id==JSCHART_OPERATOR_ID.OP_CORSSCURSOR_GOTO)   //移动十字光标{ Date:, Time }
         {
             if (!IFrameSplitOperator.IsNumber(obj.Date)) return;
@@ -73607,6 +73638,7 @@ function KLineChartContainer(uielement,OffscreenElement, cacheElement)
 
             var frame=g_ChartFrameFactory.Create("KLineFrame", { ID:i });
             frame.Canvas=this.Canvas;
+            frame.GetExtraCanvas=(name)=>{ this.GetExtraCanvas(name); };
             frame.ChartBorder=border;
             frame.Identify=i;                           //窗口序号
             frame.RightSpaceCount=this.RightSpaceCount; //右边
@@ -73692,6 +73724,7 @@ function KLineChartContainer(uielement,OffscreenElement, cacheElement)
         var frame=g_ChartFrameFactory.Create(frameClassName, { ID:id });
         
         frame.Canvas=this.Canvas;
+        frame.GetExtraCanvas=(name)=>{ this.GetExtraCanvas(name); };
         frame.ChartBorder=border;
         frame.Identify=id;                   //窗口序号
         frame.GetEventCallback=(id)=> { return this.GetEventCallback(id); };
@@ -87629,6 +87662,7 @@ function KLineChartHScreenContainer(uielement)
 
             var frame=g_ChartFrameFactory.Create("KLineHScreenFrame", { ID:i });
             frame.Canvas=this.Canvas;
+            frame.GetExtraCanvas=(name)=>{ this.GetExtraCanvas(name); };
             frame.ChartBorder=border;
             frame.Identify=i;                   //窗口序号
             frame.RightSpaceCount=this.RightSpaceCount; //右边
@@ -136410,7 +136444,8 @@ var JS_DRAWTOOL_MENU_ID=
     CMD_DELETE_DRAW_CHART_ID:6,
 
     CMD_CHANGE_FONT_COLOR_ID:7, //切换字体颜色
-    CMD_CHANGE_BG_COLOR_ID:8    //切换背景色
+    CMD_CHANGE_BG_COLOR_ID:8,    //切换背景色
+    CMD_CHANGE_BORDER_COLOR_ID:9,   //边框颜色
 };
 
 function JSDialogDrawTool()
@@ -137002,17 +137037,20 @@ function JSDialogModifyDraw()
     this.ColorButton=null;
     this.BGColorButton=null;
     this.FontColorButton=null;
+    this.BorderColorButton=null;
 
     this.RandomLineColor=["rgb(255,69,0)", "rgb(173,255,47)", "rgb(238,154,73)", "rgb(255,105,180)"];               //线段颜色
     this.RandomBGColor=["rgba(210,251,209，0.8)", "rgb(217,217,253)", "rgb(255,208,204)", "rgb(252,249,206)"];      //背景颜色
     this.RandomFontColor=["rgb(0,0,0)", "rgb(255, 0, 0)", "rgb(20, 255, 0)", "rgb(255, 0, 255)"];                   //文字颜色
+    this.RandomBorderColor=["rgb(0,0,0)", "rgb(5, 246, 143)", "rgb(139, 137, 137)", "rgb(255, 20, 147)"];           //边框颜色
 
     this.AryButton=
     [
-        { Title:"点击线段颜色", ClassName: 'hqchart_drawtool icon-huabi', Type:2, Data:{ ID:JS_DRAWTOOL_MENU_ID.CMD_CHANGE_LINE_COLOR_ID }},
-        { Title:"点击字体颜色", ClassName: 'hqchart_drawtool icon-zitiyanse', Type:2, Data:{ ID:JS_DRAWTOOL_MENU_ID.CMD_CHANGE_FONT_COLOR_ID }},
-        { Title:"点击背景色", ClassName: 'hqchart_drawtool icon-zitibeijingse', Type:2, Data:{ ID:JS_DRAWTOOL_MENU_ID.CMD_CHANGE_BG_COLOR_ID }},
-        { Title:"删除", ClassName: 'hqchart_drawtool icon-recycle_bin', Type:2, Data:{ ID:JS_DRAWTOOL_MENU_ID.CMD_DELETE_DRAW_CHART_ID }}
+        { Title:"修改线段颜色", ClassName: 'hqchart_drawtool icon-huabi', Type:2, Data:{ ID:JS_DRAWTOOL_MENU_ID.CMD_CHANGE_LINE_COLOR_ID }},
+        { Title:"修改字体颜色", ClassName: 'hqchart_drawtool icon-zitiyanse', Type:2, Data:{ ID:JS_DRAWTOOL_MENU_ID.CMD_CHANGE_FONT_COLOR_ID }},
+        { Title:"修改背景颜色", ClassName: 'hqchart_drawtool icon-zitibeijingse', Type:2, Data:{ ID:JS_DRAWTOOL_MENU_ID.CMD_CHANGE_BG_COLOR_ID }},
+        { Title:"修改边框颜色", ClassName: 'hqchart_drawtool icon-biankuang', Type:2, Data:{ ID:JS_DRAWTOOL_MENU_ID.CMD_CHANGE_BORDER_COLOR_ID }},
+        { Title:"删除图形", ClassName: 'hqchart_drawtool icon-recycle_bin', Type:2, Data:{ ID:JS_DRAWTOOL_MENU_ID.CMD_DELETE_DRAW_CHART_ID }}
     ];
    
     this.Inital=function(hqchart)
@@ -137060,14 +137098,25 @@ function JSDialogModifyDraw()
     {
         var divItem=document.createElement("div");
         divItem.className="UMyChart_Draw_Modify_Dialog_Button_Div";
+
+        var spanTooltip=document.createElement("span");
+        spanTooltip.className="UMyChart_Draw_Modify_Tooltip";
+        spanTooltip.innerText=item.Title;
+        divItem.appendChild(spanTooltip);
+
+
         var spanDom=document.createElement("span");
         spanDom.className=item.ClassName;
         spanDom.classList.add("UMyChart_DrawTool_Span");
         divItem.appendChild(spanDom);
+       
 
-        var data={ Div:divItem, Span:spanDom, Parent:parentDivDom, Item:item };
+        var data={ Div:divItem, Span:spanDom, Parent:parentDivDom, Item:item, Tooltip:spanTooltip };
         divItem.onmousedown=(e)=> { this.OnClickButton(e, data); };   //点击
 
+        divItem.onmouseover=(e)=> { this.OnHoverButton(e, data); }
+        divItem.onmouseout=(e)=>{ this.OnLeaveButton(e, data); }
+
         switch(item.Data.ID)
         {
             case JS_DRAWTOOL_MENU_ID.CMD_CHANGE_LINE_COLOR_ID:
@@ -137081,6 +137130,11 @@ function JSDialogModifyDraw()
                 this.FontColorButton=data;
                 divItem.style.display="none";
                 break;
+            case JS_DRAWTOOL_MENU_ID.CMD_CHANGE_BORDER_COLOR_ID:
+                this.BorderColorButton=data;
+                divItem.style.display="none";
+                break;
+
         }
 
         parentDivDom.appendChild(divItem);
@@ -137106,9 +137160,24 @@ function JSDialogModifyDraw()
             case JS_DRAWTOOL_MENU_ID.CMD_CHANGE_FONT_COLOR_ID:
                 this.ModifyFontColor();
                 break;
+            case JS_DRAWTOOL_MENU_ID.CMD_CHANGE_BORDER_COLOR_ID:
+                this.ModifyBorderColor();
+                break;
         }
     }
 
+    this.OnHoverButton=function(e, data)
+    {
+        //var x=e.clientX;
+        //data.Tooltip.style.left=x+"px";
+        data.Tooltip.style.display="inline";
+    }
+
+    this.OnLeaveButton=function(e, data)
+    {
+        data.Tooltip.style.display="none";
+    }
+
     this.Close=function(e)
     {
         if (!this.DivDialog) return;
@@ -137218,6 +137287,28 @@ function JSDialogModifyDraw()
         this.HQChart.Draw();
     }
 
+    this.ModifyBorderColor=function()
+    {
+        if (!this.ChartPicture || !this.HQChart) return;
+
+        if (this.ChartPicture.ClassName=="ChartDrawNote")
+        {
+            var color=this.GetRandomColor(this.ChartPicture.NoteBorderColor, this.RandomBorderColor);
+            this.ChartPicture.NoteBorderColor=color;
+        }
+        else
+        {
+            var color=this.GetRandomColor(this.ChartPicture.BorderColor, this.RandomBorderColor);
+            this.ChartPicture.BorderColor=color;
+        }
+        
+       
+        if (this.BorderColorButton) this.BorderColorButton.Span.style['color']=color;
+        if (this.HQChart.ChartDrawStorage) this.HQChart.ChartDrawStorage.SaveDrawData(this.ChartPicture);   //保存下
+
+        this.HQChart.Draw();
+    }
+
     this.Show=function(x, y)
     {
         if (!this.DivDialog) this.Create();
@@ -137231,28 +137322,32 @@ function JSDialogModifyDraw()
     {
         this.ChartPicture=chart;
 
-        var bShowLineColor=true, bShowBGColor=false, bShowFontColor=false;
-        var bgColor=null, fontColor=null;
+        var bShowLineColor=true, bShowBGColor=false, bShowFontColor=false, bShowBorderColor=false;
+        var bgColor=null, fontColor=null,borderColor=null;
         var ARRAY_TEXT_CHART=['ChartDrawPriceLabel', "ChartDrawAnchoredText","ChartDrawPriceNote"];
         if (ARRAY_TEXT_CHART.includes(chart.ClassName))
         {
             bShowBGColor=true;
             bShowFontColor=true;
+            bShowBorderColor=true;
             bgColor=chart.BGColor;
             fontColor=chart.TextColor;
+            borderColor=chart.BorderColor;
         }
         else if (chart.ClassName=="ChartDrawNote")
         {
             bShowBGColor=true;
             bShowFontColor=true;
+            bShowBorderColor=true;
             bgColor=chart.NoteBGColor;
             fontColor=chart.NoteTextColor;
+            borderColor=chart.NoteBorderColor;
         }
         
         if (this.ColorButton)
         {
             var item=this.ColorButton;
-            this.ShowButton(item.Div, bShowLineColor?"block":"none");
+            this.ShowButton(item.Div, bShowLineColor?"inline":"none");
             if (bShowLineColor)
             {
                 item.Span.style['color']=chart.LineColor;
@@ -137262,7 +137357,7 @@ function JSDialogModifyDraw()
         if (this.BGColorButton)
         {
             var item=this.BGColorButton;
-            this.ShowButton(item.Div, bShowBGColor?"block":"none");
+            this.ShowButton(item.Div, bShowBGColor?"inline":"none");
             if (bShowBGColor)
             {
                 item.Span.style['color']=bgColor;
@@ -137272,12 +137367,22 @@ function JSDialogModifyDraw()
         if (this.FontColorButton)
         {
             var item=this.FontColorButton;
-            this.ShowButton(item.Div, bShowFontColor?"block":"none");
+            this.ShowButton(item.Div, bShowFontColor?"inline":"none");
             if (bShowFontColor)
             {
                 item.Span.style['color']=fontColor;
             }
         }
+
+        if (this.BorderColorButton)
+        {
+            var item=this.BorderColorButton;
+            this.ShowButton(item.Div, bShowBorderColor?"inline":"none");
+            if (bShowBorderColor)
+            {
+                item.Span.style['color']=borderColor;
+            }
+        }
         
     }
 
@@ -137447,22 +137552,52 @@ function HQChartScriptWorker()
 
 
 
-var HQCHART_VERSION="1.1.13369";
+var HQCHART_VERSION="1.1.13380";
 
 function PrintHQChartVersion()
 {
-    var log=
-`*************************************************************************************************************
-*
-*   HQChart                                             Ver: ${HQCHART_VERSION} 
-*                             
-*   License: Apache License 2.0                                                                              
-*   Source: https://github.com/jones2000/HQChart
+    var logo=`
+
+*************************************************************************************************************************************************************************** 
+*                                                                                                                                                                                                                                                                                                                                        
+*                                                                                           :%@@-                                                                        
+*                                                                                          :@@@@-                                                                        
+*            =@@@@          :#@@@           .:+#@@@#=:                    :=*@@@@@@#+-.    *@@@@.                                                                        
+*           :@@@@@         .@@@@@         .#@@@@@@@@@@@-                +@@@@@@@@@@@@@+    @@@@@                                                     -%@@*               
+*           +@@@@%         #@@@@#        *@@@@@@@@@@@@@@%.            =@@@@@@@@@@@@@@@-    @@@@@                                                    -@@@@+               
+*           %@@@@*         @@@@@+      .%@@@@@@@@@@@@@@@@%:          #@@@@@@@@@@@@@@@%     @@@@#                                                    *@@@@=               
+*           @@@@@=         @@@@@-     .%@@@@@@@*++*%@@@@@@%        .%@@@@@@@%*+==+**=     -@@@@+                                                    #@@@@-               
+*           @@@@@.         @@@@@.     #@@@@@%=      =@@@@@@*       %@@@@@@#:              *@@@@-   :::.           .-+*###+:          :::  .+##+: -%%@@@@@%%%%            
+*          .@@@@@         .@@@@@.    +@@@@@%         .@@@@@@      *@@@@@@:                %@@@@: +@@@@@%.       :%@@@@@@@@@@:       *@@@ :@@@@@* @@@@@@@@@@@@            
+*          :@@@@@         :@@@@@     @@@@@%           :@@@@@+     @@@@@@:                 %@@@@-@@@@@@@@@.      @@@@@@@@@@@@@.     :@@@%-@@@@@@.:@@@@@@@@@@@#            
+*          -@@@@%         -@@@@@    =@@@@@.            %@@@@%    %@@@@@-                  %@@@@@@@@@@@@@@*      %@@@@@@@@@@@@+     -@@@@@@@@@@# -@@@@@@@@@@@.            
+*          +@@@@%=========#@@@@%    @@@@@#             :@@@@@   .@@@@@%                   @@@@@@@@%@@@@@@@      -%+:.  .#@@@@*     +@@@@@@@%%@. .::+@@@@#::              
+*          #@@@@@@@@@@@@@@@@@@@#   .@@@@@              .@@@@@   :@@@@@.                   @@@@@@#.  #@@@@@.             -@@@@*     #@@@@@@:        *@@@@+                
+*          %@@@@@@@@@@@@@@@@@@@+   :@@@@@              .@@@@@   -@@@@@                    @@@@@+     @@@@@.             :@@@@*     @@@@@%          #@@@@-                
+*          @@@@@@@@@@@@@@@@@@@@:   :@@@@%              :@@@@@   +@@@@%                   -@@@@+      @@@@@              -@@@@+     @@@@@.          @@@@@.                
+*         .@@@@@@@@@@@@@@@@@@@@    :@@@@%              -@@@@%   *@@@@%                   #@@@@.      @@@@@       .=*#%%%@@@@@=    :@@@@#           @@@@@.                
+*         -@@@@@:::::::::=@@@@@    :@@@@@              @@@@@*   +@@@@%                   @@@@@       @@@@%     -#@@@@@@@@@@@@:    -@@@@*           @@@@@                 
+*         =@@@@%         =@@@@%    .@@@@@             :@@@@@.   -@@@@%                   @@@@@      .@@@@*    +@@@@@@@@@@@@@@.    =@@@@+          .@@@@@                 
+*         +@@@@#         +@@@@#     @@@@@#            %@@@@%    :@@@@@                  .@@@@%      =@@@@=   -@@@@@*-:..%@@@@     +@@@@=          :@@@@#                 
+*         *@@@@*         *@@@@*     +@@@@@:          #@@@@@+    .@@@@@@                 :@@@@%      *@@@@-   @@@@@.     @@@@%     #@@@@:          =@@@@+                 
+*         %@@@@=         %@@@@+      @@@@@@-       .%@@@@@#      #@@@@@#                :@@@@%      #@@@@:   @@@@%      @@@@*     %@@@@.          #@@@@-                 
+*         @@@@@-         @@@@@=      =@@@@@@#=...-*@@@@@@@:       @@@@@@%=.    :+**.    :@@@@*      %@@@@.  .@@@@*     *@@@@=     @@@@@           %@@@@+                 
+*        .@@@@@:        .@@@@@:       *@@@@@@@@@@@@@@@@@@@#       =@@@@@@@@%%%@@@@@@    +@@@@-      @@@@@   .@@@@@:  :%@@@@@-    .@@@@%           %@@@@@*+-              
+*        :@@@@@         :@@@@@         +@@@@@@@@@@@@@@@@@@@#       =@@@@@@@@@@@@@@@@%   %@@@@       @@@@@    @@@@@@@@@@@@@@@:    -@@@@*           *@@@@@@@@-             
+*        =@@@@@         -@@@@@          :@@@@@@@@@@@@@@@@@@@#       :@@@@@@@@@@@@@@@%   @@@@@       %@@@%    #@@@@@@@@@#@@@@.    +@@@@-           .@@@@@@@@#             
+*        *@@@@#         =@@@@%            :#@@@@@@@#: :@@@@@=         =@@@@@@@@@@@+.    @@@@@       :@@@+     *@@@@@@@- %@@@     *@@@=             =@@@@@@@*             
+*        =++++-         -++++=               .:::.     .=*+:            :-=+++=:.       ****=        .=+.      .-++=:   :+++     -+=:               .-=+=:.     
+*        
+*        
+*        HQChart       
+*        Ver: ${HQCHART_VERSION}  
+*        License: Apache License 2.0                                                                              
+*        Source: https://github.com/jones2000/HQChart
 *
-*************************************************************************************************************
-`
-
-    console.log(log);
+**************************************************************************************************************************************************************************                                                                                                                                                                      
+    `;
+    
+    console.log(logo);
 }