hqchart 1.1.14516 → 1.1.14533

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hqchart",
-  "version": "1.1.14516",
+  "version": "1.1.14533",
   "description": "HQChart - H5, 微信小程序 沪深/港股/数字货币/期货/美股 K线图(kline),走势图,缩放,拖拽,十字光标,画图工具,截图,筹码图. 分析家语法,通达信语法,(麦语法),第3方数据对接",
   "main": "lib/main.js",
   "scripts": {

package/src/jscommon/umychart.DialogDrawTool.js

@@ -24,6 +24,11 @@ var JS_DRAWTOOL_MENU_ID=
     CMD_CHANGE_BORDER_COLOR_ID:9,   //边框颜色
 
     CMD_LOCK_DRAW_CHART_ID:10,      //上锁
+
+    CMD_ZOOM_FONT_ID:11,    //字体放大
+    CMD_ZOOM_OUT_FONT_ID:12, //字体缩小
+    CMD_MODIFY_TEXT_ID:13,  //随机生成文字内容
+    CMD_ADVANCED_SETTING_ID:14, //高级设置
 };
 
 function JSDialogDrawTool()
@@ -116,6 +121,7 @@ function JSDialogDrawTool()
                 { Title: '时间范围', ClassName: 'hqchart_drawtool icon-jiagefanwei', Type:0, Data:{ ID:"DateRange" }  },
                 { Title: "价格和时间范围", ClassName:"hqchart_drawtool icon-jiagefanwei", Type:0, Data:{ ID:"DatePriceRange" } },
                 { Title: "监测线", ClassName:"hqchart_drawtool icon-jiance", Type:0, Data:{ ID:"MonitorLine"} },
+                { Title: "固定范围成交量分布图", ClassName:"hqchart_drawtool icon-tubiao_gudingfanweichengjiaoliangfenbutu", Type:0, Data:{ ID:"固定范围成交量分布图"}}
             ]
         },
         {
@@ -625,6 +631,10 @@ function JSDialogModifyDraw()
     this.FontColorButton=null;
     this.BorderColorButton=null;
     this.LockButton=null;
+    this.FontZoomButton=null;
+    this.FontZoomOutButton=null;
+    this.ModifyTextButton=null;
+    this.AdvancedButton=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)"];      //背景颜色
@@ -637,9 +647,13 @@ function JSDialogModifyDraw()
         { 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-zoomin', Type:2, Data:{ ID:JS_DRAWTOOL_MENU_ID.CMD_ZOOM_FONT_ID }},
+        { Title:"字体缩小", ClassName: 'hqchart_drawtool icon-zoomout', Type:2, Data:{ ID:JS_DRAWTOOL_MENU_ID.CMD_ZOOM_OUT_FONT_ID }},
+        { Title:"随机生成文字内容", ClassName: 'hqchart_drawtool icon-bianji', Type:2, Data:{ ID:JS_DRAWTOOL_MENU_ID.CMD_MODIFY_TEXT_ID }},
+        { Title:"高级设置", ClassName: 'hqchart_drawtool icon-setting', Type:2, Data:{ ID:JS_DRAWTOOL_MENU_ID.CMD_ADVANCED_SETTING_ID }},
+
         { Title:"上锁", ClassName: 'hqchart_drawtool icon-lock', Type:2, Data:{ ID:JS_DRAWTOOL_MENU_ID.CMD_LOCK_DRAW_CHART_ID }},
         { Title:"删除图形", ClassName: 'hqchart_drawtool icon-recycle_bin', Type:2, Data:{ ID:JS_DRAWTOOL_MENU_ID.CMD_DELETE_DRAW_CHART_ID }},
-
     ];
 
     this.RestoreFocusDelay=800;
@@ -729,7 +743,22 @@ function JSDialogModifyDraw()
                 this.LockButton=data;
                 this.LockButton.Span.style['color']="rgb(220,220,220)";
                 break;
-
+            case JS_DRAWTOOL_MENU_ID.CMD_ZOOM_FONT_ID:
+                this.FontZoomButton=data;
+                divItem.style.display="none";
+                break;
+            case JS_DRAWTOOL_MENU_ID.CMD_ZOOM_OUT_FONT_ID:
+                this.FontZoomOutButton=data;
+                divItem.style.display="none";
+                break;  
+            case JS_DRAWTOOL_MENU_ID.CMD_MODIFY_TEXT_ID:
+                this.ModifyTextButton=data;
+                divItem.style.display="none";
+                break;  
+            case JS_DRAWTOOL_MENU_ID.CMD_ADVANCED_SETTING_ID:
+                this.AdvancedButton=data;
+                divItem.style.display="none";
+                break;    
         }
 
         parentDivDom.appendChild(divItem);
@@ -761,6 +790,18 @@ function JSDialogModifyDraw()
             case JS_DRAWTOOL_MENU_ID.CMD_LOCK_DRAW_CHART_ID:
                 this.ModifyLockChart();
                 break;
+            case JS_DRAWTOOL_MENU_ID.CMD_ZOOM_FONT_ID:
+                this.ModifyFontZoom(1);
+                break;
+            case JS_DRAWTOOL_MENU_ID.CMD_ZOOM_OUT_FONT_ID:
+                this.ModifyFontZoom(-1);
+                break;
+            case JS_DRAWTOOL_MENU_ID.CMD_MODIFY_TEXT_ID:
+                this.ModifyText();
+                break;
+            case JS_DRAWTOOL_MENU_ID.CMD_ADVANCED_SETTING_ID:
+                this.AdvancedSetting();
+                break;
         }
     }
 
@@ -802,6 +843,19 @@ function JSDialogModifyDraw()
         this.Close();
     }
 
+    this.OnClearChartDrawPicture=function(drawPicture)
+    {
+        if (!this.IsShow()) return;
+
+        if (!drawPicture) 
+        {
+            this.Close();
+            return;
+        }
+
+        if (this.ChartPicture && drawPicture.Guid==this.ChartPicture.Guid) this.Close();
+    }
+
     this.ShowButton=function(dom, diaplay)
     {
         if (dom.style.display==diaplay) return;
@@ -917,6 +971,65 @@ function JSDialogModifyDraw()
         this.HQChart.Draw();
     }
 
+    this.ModifyFontZoom=function(step)
+    {
+        if (!this.ChartPicture || !this.HQChart) return;
+        if (this.ChartPicture.FontOption.Size+step<=2) return;
+
+        var chart=this.ChartPicture;
+        chart.FontOption.Size+=step;
+
+        if (chart.ClassName=="ChartDrawNote") chart.NoteFontOption.Size+=step;
+
+        this.HQChart.Draw();
+    }
+
+    this.ModifyText=function()
+    {
+        if (!this.ChartPicture || !this.HQChart) return;
+
+        var chart=this.ChartPicture;
+        switch(chart.ClassName)
+        {
+            case "ChartDrawPictureText":
+                chart.Text=this.GetRandomText(chart.Text);
+                break;
+            case "ChartDrawAnchoredText":
+                var text=null;
+                if (IFrameSplitOperator.IsNonEmptyArray(chart.AryText)) text=chart.AryText[0].Text;
+                chart.AryText=[ {Text:this.GetRandomText(text)},  {Text:this.GetRandomText(null)}];
+                break;
+            case "ChartDrawNote":
+                var text=null;
+                if (IFrameSplitOperator.IsNonEmptyArray(chart.AryNoteText)) text=chart.AryNoteText[0].Text;
+                chart.AryNoteText=[ {Text:this.GetRandomText(text)},  {Text:this.GetRandomText(null)}];
+                break;
+            default:
+                return;
+        }
+
+        this.HQChart.Draw();
+    }
+
+    this.GetRandomText=function(text)
+    {
+        var ARY_TEXT=["下跌形态","反转十字星","低位档五阳线","倒V型反转","双顶","持续整理形态"];
+
+        var index=this.GetRandomTestData(0, ARY_TEXT.length-1);
+        for(var i=index;i<10;++i)
+        {
+            var value=ARY_TEXT[i%ARY_TEXT.length];
+            if (value!=text) return value;
+        }
+    }
+
+    this.GetRandomTestData=function(min, max)   //测试数据
+    {
+        min = Math.ceil(min);
+        max = Math.floor(max);
+        return Math.floor(Math.random() * (max - min + 1)) + min; //含最大值，含最小值 
+    }
+
     this.Show=function(x, y)
     {
         if (!this.DivDialog) this.Create();
@@ -930,27 +1043,42 @@ function JSDialogModifyDraw()
     {
         this.ChartPicture=chart;
 
-        var bShowLineColor=true, bShowBGColor=false, bShowFontColor=false, bShowBorderColor=false;
+        var bShowLineColor=true, bShowBGColor=false, bShowFontColor=false, bShowBorderColor=false, bShowFontZoom=false, bModifyText=false, bAdvanced=false;;
         var bgColor=null, fontColor=null,borderColor=null;
-        var ARRAY_TEXT_CHART=['ChartDrawPriceLabel', "ChartDrawAnchoredText","ChartDrawPriceNote"];
+        var ARRAY_TEXT_CHART=['ChartDrawPriceLabel', "ChartDrawAnchoredText","ChartDrawPriceNote", ];
         if (ARRAY_TEXT_CHART.includes(chart.ClassName))
         {
             bShowBGColor=true;
             bShowFontColor=true;
             bShowBorderColor=true;
+            bShowFontZoom=true;
+            if (chart.ClassName=="ChartDrawAnchoredText") bModifyText=true;
             bgColor=chart.BGColor;
             fontColor=chart.TextColor;
             borderColor=chart.BorderColor;
         }
+        else if (chart.ClassName=="ChartDrawPictureText")
+        {
+            bModifyText=true;
+            bShowFontZoom=true;
+            bShowLineColor=true;
+        }
         else if (chart.ClassName=="ChartDrawNote")
         {
             bShowBGColor=true;
             bShowFontColor=true;
             bShowBorderColor=true;
+            bModifyText=true;
+            bShowFontZoom=true;
             bgColor=chart.NoteBGColor;
             fontColor=chart.NoteTextColor;
             borderColor=chart.NoteBorderColor;
         }
+        else if (chart.ClassName=="ChartDrawVolProfile")
+        {
+            bShowLineColor=false;
+            bAdvanced=true;
+        }
         
         if (this.ColorButton)
         {
@@ -997,6 +1125,30 @@ function JSDialogModifyDraw()
             var item=this.LockButton;
             item.Span.style['color']=this.ChartPicture.EnableMove?"rgb(220,220,220)":"rgb(0,0,0)";
         }
+
+        if (this.FontZoomButton)
+        {
+            var item=this.FontZoomButton;
+            this.ShowButton(item.Div, bShowFontZoom?"inline":"none");
+        }
+
+        if (this.FontZoomOutButton)
+        {
+            var item=this.FontZoomOutButton;
+            this.ShowButton(item.Div, bShowFontZoom?"inline":"none");
+        }
+
+        if (this.ModifyTextButton)
+        {
+            var item=this.ModifyTextButton;
+            this.ShowButton(item.Div, bModifyText?"inline":"none");
+        }
+
+        if (this.AdvancedButton)
+        {
+            var item=this.AdvancedButton;
+            this.ShowButton(item.Div, bAdvanced?"inline":"none");
+        }
     }
 
     this.OnMouseDownTitle=function(e)

package/src/jscommon/umychart.DialogSearchIndex.js

@@ -1110,8 +1110,16 @@ function JSDialogModifyIndexParam()
 
         item.Value=value;
 
-        if (this.IndexData.Type==1) this.HQChart.UpdateWindowIndex(this.IndexData.WindowIndex);
-        else if (this.IndexData.Type==2) this.HQChart.UpdateOverlayIndex(this.IndexData.Identify);
+        
+
+        if (this.IndexData.Type==1) 
+        {
+            this.HQChart.UpdateWindowIndex(this.IndexData.WindowIndex);
+        }
+        else if (this.IndexData.Type==2) 
+        {
+            this.HQChart.UpdateOverlayIndex(this.IndexData.Identify);
+        }
     }
 }
 

package/src/jscommon/umychart.NetworkFilterTest.js

@@ -55696,6 +55696,13 @@ HQData.NetworkFilter=function(data, callback)
             HQData.Report_APIIndex(data, callback);
             break;
 
+
+        /////////////////////////////////////////////////////////////////
+        //
+        case "KLineChartContainer::RequestVolumeProfileData":       //成交量分布图
+            HQData.RequestVolumeProfileData(data, callback);
+            break;
+
     }
 }
 
@@ -56794,7 +56801,7 @@ HQData.Report_RequestStockData=function(data, callback)
                 newItem[33]=kData;
 
 
-                newItem[101]=HQData.GetRandomTestData(-90,1000);
+                newItem[101]=HQData.GetRandomTestData(-9990,10000000);
                 newItem[201]=`A-[${HQData.GetRandomTestData(-90,90)}]-B`;
 
 
@@ -58440,3 +58447,64 @@ HQData.APIIndex_TITLE=function(data, callback)
 }
 
 
+HQData.RequestVolumeProfileData=function(data, callback)
+{
+    var request=data.Request;
+    var startIndex=request.Start.DataIndex;
+    var endIndex=request.End.DataIndex;
+
+    var hqchart=data.Self;
+    var kData=hqchart.GetKData();
+
+    var maxPrice=null,minPrice=null;
+    for(var i=startIndex;i<=endIndex && i<kData.Data.length; ++i)
+    {
+        var kItem=kData.Data[i];
+        if (!kItem) continue;
+        
+        if (maxPrice==null || maxPrice<kItem.High) maxPrice=kItem.High;
+        if (minPrice==null || minPrice>kItem.Low) minPrice=kItem.Low;
+    }
+
+    var aryData=[];
+    var step=0.1;
+    for(var i=minPrice, j=0;i<=maxPrice; i+=step, ++j)
+    {
+        var item=
+        {
+            Price:i, 
+            Vol:
+            [
+                {
+                    Value:HQData.GetRandomTestData(0,500)*1000, 
+                    //Color:"rgba(103,179,238,0.8)",
+                    ColorID:0,
+                }, 
+                {
+                    Value:HQData.GetRandomTestData(0,500)*1000, 
+                    //Color:"rgba(237,208,105,0.8)",
+                    ColorID:1,
+                }
+            ]
+        };
+
+        item.TotalVol={ Value:item.Vol[0].Value+ item.Vol[1].Value, ColorID:0 };
+
+        if (j>5)
+        {
+            item.Vol[0].ColorID=2;
+            item.Vol[1].ColorID=3;
+            item.TotalVol.ColorID=2;
+        }
+
+        aryData.push(item);
+    }
+
+    var hqchartData={ Data:aryData, MaxPrice:maxPrice, MinPrice:minPrice, PriceOffset:step, code:0 };
+
+    console.log('[HQData.RequestVolumeProfileData] hqchartData=', hqchartData);
+
+    callback(hqchartData);
+}
+
+

package/src/jscommon/umychart.PopKLineChart.js

@@ -0,0 +1,272 @@
+
+
+/*
+   Copyright (c) 2018 jones
+ 
+   http://www.apache.org/licenses/LICENSE-2.0
+
+   开源项目 https://github.com/jones2000/HQChart
+ 
+   jones_2000@163.com
+*/
+
+
+///////////////////////////////////////////////////////
+//  K线图提示信息
+//
+//////////////////////////////////////////////////////
+
+function JSTooltipKLineChart()
+{
+    this.DivDialog=null;
+    this.HQChart=null;
+    this.ID=Guid();
+
+    this.BGColor=g_JSChartResource.PopMinuteChart.BGColor;
+    this.BorderColor=g_JSChartResource.PopMinuteChart.BorderColor;
+    this.OnCreateCallback;
+
+    this.KLine=
+    {
+        Option:JSTooltipKLineChart.GetKLineOption(),
+        JSChart:null,
+        Symbol:null,
+    }
+
+    this.Inital=function(hqchart, option)
+    {
+        this.HQChart=hqchart;
+
+        if (option)
+        {
+            if (IFrameSplitOperator.IsObject(option.Option)) 
+            {
+                var item=CloneData(option.Option);  //复制一份出来
+                this.KLine.Option=Object.assign(this.KLine.Option,item);
+            }
+            if (option.OnCreateCallback) this.OnCreateCallback=option.OnCreateCallback;
+        }
+    }
+
+    this.Create=function()
+    {
+        var divDom=document.createElement('div');
+        divDom.className='UMyChart_Tooltip_KLine_Div';
+        divDom.id=this.ID;
+
+        var divChart=document.createElement('div');
+        divChart.className='UMyChart_Tooltip_KLine_Chart_Div';
+        divDom.appendChild(divChart);
+
+        this.DivDialog=divDom;
+
+        var chart=JSChart.Init(divChart);
+        this.KLine.JSChart=chart;
+
+        //语言跟主图保持一致
+        if (this.HQChart) this.KLine.Option.Language=g_JSChartLocalization.GetLanguageName(this.HQChart.LanguageID);
+        this.KLine.Option.OnCreatedCallback=(chart)=>{ this.OnCreateHQChart(chart); }
+        this.KLine.Option.NetworkFilter=(data, callback)=>{ this.NetworkFilter(data, callback); }
+        chart.SetOption(this.KLine.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;
+
+        this.HQChart.NetworkFilter(data, callback);       
+    }
+
+    this.OnCreateHQChart=function(chart)
+    {
+        if (this.OnCreateCallback) this.OnCreateCallback(chart);
+    }
+
+    this.Destroy=function()
+    {
+        if (this.DivDialog) document.body.removeChild(this.DivDialog);
+        this.DivDialog=null;
+        this.TitleBox=null;
+        if (!this.KLine.JSChart) this.KLine.JSChart.ChartDestory();
+        this.KLine.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;
+        if (this.KLine.JSChart)
+        {
+            if (this.KLine.Symbol!=symbol)
+            {
+                this.KLine.Symbol=symbol;
+                this.KLine.JSChart.ChangeSymbol(symbol);
+            }
+        }
+
+        if (!this.KLine.Option.EnableResize)
+        {
+            if (this.KLine.JSChart) this.KLine.JSChart.OnSize({ Type:1 });
+        }
+
+        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=(rtItem.Left+data.Offset.Left)-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';
+    }
+
+
+    this.ReloadResource=function(option)
+    {
+        this.BGColor=g_JSChartResource.PopMinuteChart.BGColor;
+        this.BorderColor=g_JSChartResource.PopMinuteChart.BorderColor;
+
+        if (!this.DivDialog) return;
+
+        this.UpdateStyle();
+
+        if (this.KLine.JSChart) this.KLine.JSChart.ReloadResource(option);
+    }
+
+}
+
+JSTooltipKLineChart.GetKLineOption=function()
+{
+    var option=
+    {
+        Type:'历史K线图',   //创建图形类型
+        Windows: //窗口指标
+        [
+            { Index:"MA",Change:false, Modify:false },
+            { Index:"MACD", Close:false, Change:false, Modify:false,MaxMin:false,TitleWindow:false },
+        ], 
+
+        //Language:'EN',
+
+        Symbol:null,
+        IsAutoUpdate:false,       //是自动更新数据
+        AutoUpdateFrequency:3000,   //数据更新频率
+               
+
+        SplashTitle:'加载数据中......',
+        IsShowRightMenu:false,          //右键菜单
+        CtrlMoveStep:10,
+    
+        KLine:  //K线设置
+        {
+            DragMode:1,                 //拖拽模式 0=禁止拖拽 1=数据拖拽 2=区间选择
+            Right:1,                    //复权 0 不复权 1 前复权 2 后复权
+            Period:0,                   //周期 0 日线 1 周线 2 月线 3 年线 
+            MaxRequestDataCount:3000,   //数据个数
+            MaxRequestMinuteDayCount:5, //分钟数据获取几天数据  默认取5天数据
+            IsShowTooltip:false,                 //是否显示K线提示信息
+            DrawType:0,      //K线类型 0=实心K线柱子 1=收盘价线 2=美国线 3=空心K线柱子 4=收盘价面积图
+            KLineDoubleClick:false, //禁止双击弹框
+            RightSpaceCount:0,
+            ZoomType:0,
+            DataWidth:2,
+        },
+
+        StepPixel:0,
+
+        Listener:
+        {
+            KeyDown:false,
+            Wheel:false
+        },
+
+                
+    
+        KLineTitle: //标题设置
+        {
+            IsShowName:true,        //不显示股票名称
+            IsShowSettingInfo:true, //不显示周期/复权
+            //IsTitleShowLatestData:true,
+        },
+    
+        Border: //边框
+        {
+            
+            Left:1,         //左边间距
+            Right:20,       //右边间距
+            Bottom:25,      //底部间距
+            Top:25,         //顶部间距
+
+            AutoLeft:{ Blank:10, MinWidth:30 },
+            AutoRight:{ Blank:5, MinWidth:30 },
+        },
+                
+            Frame:  //子框架设置
+            [
+                {
+                    SplitCount:4,
+                    IsShowLeftText:false,
+                },
+
+                { SplitCount:3,IsShowLeftText:false, },
+                { SplitCount:3, IsShowLeftText:false,}
+            ],
+        }
+    return option;
+}
+
+
+
+
+
+
+
+
+
+