hqchart 1.1.12387 → 1.1.12391

package/lib/umychart.vue.js

@@ -1314,7 +1314,7 @@ this.OffscreenCanvasElement;if(bOffscreen==true)this.OffscreenCanvasElement=docu
 this.CacheCanvasElement=null;if(bCacheCanvas)this.CacheCanvasElement=document.createElement("canvas");//改参数div
 this.ModifyIndexDialog=new ModifyIndexDialog(divElement);this.ChangeIndexDialog=new ChangeIndexDialog(divElement);this.MinuteDialog=new MinuteDialog(divElement);//额外的画布
 this.MapExtraCanvasElement=new _map2.default();//key=画布名字, value={ Element:, Canvas:}
-this.CreateExtraCanvasElement=function(name){if(this.MapExtraCanvasElement.has(name))return this.MapExtraCanvasElement.get(name);var element=document.createElement("canvas");element.className='jschart-drawing-extra';element.id=Guid();if(name==JSChart.CorssCursorCanvasKey)element.setAttribute("tabindex",5);else element.setAttribute("tabindex",1);if(element.style){element.style.outline='none';element.style.position="absolute";element.style.left='0px';element.style.top='0px';element.style["pointer-events"]="none";}divElement.appendChild(element);var item={Element:element,Canvas:null};this.MapExtraCanvasElement.set(name,item);};this.GetExtraCanvas=function(name){if(!this.MapExtraCanvasElement.has(name))return null;var item=this.MapExtraCanvasElement.get(name);if(!item.Element)return null;if(!item.Canvas)item.Canvas=item.Element.getContext("2d");return item;};this.OnSize=function(option)//{ Type:1 新版本OnSize  Redraw:是否重绘, XYSplit:是否重新计算分割线 }
+this.CreateExtraCanvasElement=function(name,option){if(this.MapExtraCanvasElement.has(name))return this.MapExtraCanvasElement.get(name);var element=document.createElement("canvas");element.className='jschart-drawing-extra';element.id=Guid();if(name==JSChart.CorssCursorCanvasKey)element.setAttribute("tabindex",5);else element.setAttribute("tabindex",1);if(element.style){element.style.outline='none';element.style.position="absolute";element.style.left='0px';element.style.top='0px';element.style["pointer-events"]="none";}if(option){if(IFrameSplitOperator.IsNumber(option.TabIndex))element.setAttribute("tabindex",option.TabIndex);}divElement.appendChild(element);var item={Element:element,Canvas:null};this.MapExtraCanvasElement.set(name,item);};this.GetExtraCanvas=function(name){if(!this.MapExtraCanvasElement.has(name))return null;var item=this.MapExtraCanvasElement.get(name);if(!item.Element)return null;if(!item.Canvas)item.Canvas=item.Element.getContext("2d");return item;};this.OnSize=function(option)//{ Type:1 新版本OnSize  Redraw:是否重绘, XYSplit:是否重新计算分割线 }
 {//画布大小通过div获取
 var height=parseInt(this.DivElement.style.height.replace("px",""));if(this.ToolElement){//TODO调整工具条大小
 height-=this.ToolElement.style.height.replace("px","");//减去工具条的高度
@@ -1592,8 +1592,9 @@ ON_RELOAD_INDEX_CHART_RESOURCE:103,//加载指标图形额外资源
 ON_RELOAD_OVERLAY_INDEX_CHART_RESOURCE:104,//加载叠加指标图形额外资源
 ON_CREATE_FRAME:105,ON_DELETE_FRAME:106,ON_SIZE_FRAME:107,ON_TOUCH_SCROLL_UP_DOWN:108,//页面上下滚动 手机端
 ON_RECV_REALTIME_DATA:109,//实时数据
-ON_CUSTOM_OVERLAY_TOOLBAR:110//自定义叠加指标按钮
-};var JSCHART_OPERATOR_ID={OP_SCROLL_LEFT:1,//往左移动
+ON_CUSTOM_OVERLAY_TOOLBAR:110,//自定义叠加指标按钮
+//绘图之前的事件
+ON_BEFORE_DRAW:111,ON_BEFORE_DRAW_DYNAMIC_INFO:112};var JSCHART_OPERATOR_ID={OP_SCROLL_LEFT:1,//往左移动
 OP_SCROLL_RIGHT:2,//往右移动
 OP_ZOOM_OUT:3,//缩小
 OP_ZOOM_IN:4,//放大
@@ -1815,7 +1816,7 @@ for(var i=0;i<this.ChartDrawPicture.length;++i){var item=this.ChartDrawPicture[i
 for(var i=0;i<this.ChartPaint.length;++i){var item=this.ChartPaint[i];item.Canvas=canvas;}//扩展图形
 for(var i=0;i<this.ChartPaintEx.length;++i){var item=this.ChartPaintEx[i];item.Canvas=canvas;}//叠加股票
 for(var i=0;i<this.OverlayChartPaint.length;++i){var item=this.OverlayChartPaint[i];item.Canvas=canvas;}//扩展画法
-for(var i=0;i<this.ExtendChartPaint.length;++i){var item=this.ExtendChartPaint[i];item.Canvas=canvas;}};this.Draw=function(){var _this6=this;if(this.ChartCorssCursor)this.ChartCorssCursor.Status=0;if(this.UIElement.width<=0||this.UIElement.height<=0)return;this.StopDrawDynamicInfo();this.Canvas.clearRect(0,0,this.UIElement.width,this.UIElement.height);if(this.CacheCanvas)this.CacheCanvas.clearRect(0,0,this.UIElement.width,this.UIElement.height);var pixelTatio=GetDevicePixelRatio();//获取设备的分辨率
+for(var i=0;i<this.ExtendChartPaint.length;++i){var item=this.ExtendChartPaint[i];item.Canvas=canvas;}};this.Draw=function(){var _this6=this;if(this.ChartCorssCursor)this.ChartCorssCursor.Status=0;if(this.UIElement.width<=0||this.UIElement.height<=0)return;this.StopDrawDynamicInfo();var event=this.GetEventCallback(JSCHART_EVENT_ID.ON_BEFORE_DRAW);if(event&&event.Callback){var sendData={};event.Callback(event,sendData,this);}this.Canvas.clearRect(0,0,this.UIElement.width,this.UIElement.height);if(this.CacheCanvas)this.CacheCanvas.clearRect(0,0,this.UIElement.width,this.UIElement.height);var pixelTatio=GetDevicePixelRatio();//获取设备的分辨率
 this.Canvas.lineWidth=pixelTatio;//手机端需要根据分辨率比调整线段宽度
 if(this.ChartSplashPaint&&this.ChartSplashPaint.IsEnableSplash){this.Frame.ClearCoordinateText();this.Frame.Draw({IsEnableSplash:this.ChartSplashPaint.IsEnableSplash});this.ChartSplashPaint.Draw();return;}if(this.CacheCanvas)this.SetCanvas(this.CacheCanvas);//框架
 if(this.Frame.SetBeforeDrawXYCallback){this.Frame.SetBeforeDrawXYCallback(function(frame){_this6.BeforeDrawXYCoordinate(frame);});}this.Frame.Draw();if(this.Frame.DrawCustomVertical){var eventCVericalDraw=this.GetEventCallback(JSCHART_EVENT_ID.ON_CUSTOM_VERTICAL_DRAW);this.Frame.DrawCustomVertical(eventCVericalDraw);}this.Frame.CalculateLock();for(var i=0;i<this.ChartDrawPicture.length;++i){var item=this.ChartDrawPicture[i];if(!item.IsDrawMain)continue;if(item.IsDrawMain())item.MainDraw();}//框架内图形
@@ -1846,7 +1847,7 @@ for(var i=0;i<frame.CustomHorizontalInfo.length;++i){var info=frame.CustomHorizo
 var newCustomHorizontalInfo=frame.CustomHorizontalInfo.filter(function(value,index,ary){return value.Type!=4;});frame.CustomHorizontalInfo=newCustomHorizontalInfo;}for(var i=0;i<this.OverlayChartPaint.length;++i){var item=this.OverlayChartPaint[i];if(!item)continue;if(item.YInfoType!=4)continue;var data=item.Data;if(!data||!IFrameSplitOperator.IsNonEmptyArray(data.Data))continue;if(!IFrameSplitOperator.IsNumber(item.DrawKRange.Start)||!IFrameSplitOperator.IsNumber(item.DrawKRange.End))continue;var startKLine=data.Data[item.DrawKRange.Start];var endKLine=data.Data[item.DrawKRange.End];var value=(endKLine.Close-startKLine.Close)/startKLine.Close*100;var info=new CoordinateInfo();info.Value=endKLine.Close/item.ShowRange.FirstOverlayOpen*item.ShowRange.FirstOpen;info.Message[1]=value.toFixed(2)+"%";info.LineType=-1;info.Type=item.YInfoType;//叠加股票
 info.LineColor=item.Color;info.TextColor=g_JSChartResource.FrameLatestPrice.OverlayTextColor;if(item.Title)info.Title=item.Title;frame.CustomHorizontalInfo.push(info);}};this.OffscreenToShowCanvas=function(){if(!this.ShowCanvas)return;this.ShowCanvas.clearRect(0,0,this.UIElement.width,this.UIElement.height);this.ShowCanvas.drawImage(this.OffscreenCanvasElement,0,0);};this.GetDrawStatus=function(){var status={Point:{X:this.LastPoint.X,Y:this.LastPoint.Y},IsOnTouch:this.IsOnTouch,CorssCursorTouchEnd:this.CorssCursorTouchEnd,IsTitleShowLatestData:this.IsTitleShowLatestData,IsMinuteChart:this.ClassName=="MinuteChartContainer"||this.ClassName=="MinuteChartHScreenContainer"?true:false};status.FrameID=this.Frame.PtInFrame(this.LastPoint.X,this.LastPoint.Y);return status;};//画动态信息
 this.DrawDynamicInfo=function(option){this.LastMouseStatus.MouseOnToolbar=null;//鼠标在工具栏按钮上
-if(this.Frame.ScreenImageData==null&&!this.CacheCanvas)return;var isErase=false;if(this.ChartCorssCursor){if(this.ChartCorssCursor.PointX!=null||this.ChartCorssCursor.PointY!=null)isErase=true;}isErase=true;//每次都擦除背景
+if(this.Frame.ScreenImageData==null&&!this.CacheCanvas)return;var event=this.GetEventCallback(JSCHART_EVENT_ID.ON_BEFORE_DRAW_DYNAMIC_INFO);if(event&&event.Callback){var sendData={};event.Callback(event,sendData,this);}var isErase=false;if(this.ChartCorssCursor){if(this.ChartCorssCursor.PointX!=null||this.ChartCorssCursor.PointY!=null)isErase=true;}isErase=true;//每次都擦除背景
 if(isErase==false){for(var i=0;i<this.ExtendChartPaint.length;++i){var item=this.ExtendChartPaint[i];if(item.IsCallbackDraw)continue;if(item.IsDynamic&&item.IsEraseBG){isErase=true;break;}}}if(isErase){if(this.Frame.ScreenImageData){this.Canvas.putImageData(this.Frame.ScreenImageData,0,0);}else if(this.CacheCanvas){this.Canvas.clearRect(0,0,this.UIElement.width,this.UIElement.height);this.Canvas.drawImage(this.CacheElement,0,0);}}if(this.Frame.DrawToolbar)this.Frame.DrawToolbar(this.LastMouseStatus);this.DrawSelectedStatus();var moveonPoint=null;if(this.LastMouseStatus&&this.LastMouseStatus.MoveOnPoint)moveonPoint=this.LastMouseStatus.MoveOnPoint;for(var i=0;i<this.ExtendChartPaint.length;++i)//动态扩展图形
 {var item=this.ExtendChartPaint[i];if(item.IsCallbackDraw)continue;if(item.DrawAfterPicture)continue;if(item.IsDynamic&&item.DrawAfterTitle===false&&item.IsAnimation==false){item.Draw();if(item.DrawToolbar)item.DrawToolbar(moveonPoint,this.LastMouseStatus);}}for(var i=0;i<this.ChartDrawPicture.length;++i){var item=this.ChartDrawPicture[i];if(item.IsDrawFirst)item.Draw();}this.DrawDrawPictureXYCoordinate();if(this.ChartCorssCursor){this.ChartCorssCursor.LastPoint=this.LastPoint;this.ChartCorssCursor.CursorIndex=this.CursorIndex;var bRestoreCanvas=false;if(this.CorssCursorCanvas)//独立的十字光标层
 {this.ChartCorssCursor.Canvas=this.CorssCursorCanvas;this.ChartCorssCursor.Canvas.clearRect(0,0,this.CorssCursorElement.width,this.CorssCursorElement.height);bRestoreCanvas=true;}if(option&&option.Corss==false){}else if(this.DragMode==JSCHART_DRAG_ID.CLICK_TOUCH_MODE_ID){if(this.TouchStatus.CorssCursorShow==true)this.ChartCorssCursor.Draw();}else if(this.IsOnTouch===false&&this.CurrentChartDrawPicture&&this.CurrentChartDrawPicture.IsShowCorssCursor===true)//开始绘图
@@ -4097,11 +4098,13 @@ this.ArrawAngle=35;//三角斜边一直线夹角
 this.ArrawLength=10;//三角斜边长度
 this.ArrawLineWidth=5;//箭头粗细
 this.Arrow={Start:false,End:false};//Start=是否绘制开始箭头 <-   End=是否绘制结束箭头 ->
-this.IsFullRangeMaxMin=false;this.Draw=function(){if(!this.IsShow||this.ChartFrame.IsMinSize)return;if(!this.Data||this.Data.length<=0)return;if(!IFrameSplitOperator.IsNonEmptyArray(this.Lines))return;this.IsHScreen=this.ChartFrame.IsHScreen===true;var xPointCount=this.ChartFrame.XPointCount;var offset=this.Data.DataOffset;var drawLines=[];var arrowLines=[];for(var i=0;i<this.Lines.length;++i){var line=this.Lines[i];var drawPoints={Point:[],Color:line.Color};var drawArrowPoints={Start:[],End:[]};if(line.BGColor)drawPoints.BGColor=line.BGColor;var isExtendLine=false;if(IFrameSplitOperator.IsBool(line.IsExtendLine))isExtendLine=line.IsExtendLine;if(isExtendLine)//左右延申
+this.IsFullRangeMaxMin=false;this.Draw=function(){if(!this.IsShow||this.ChartFrame.IsMinSize)return;if(!this.Data||this.Data.length<=0)return;if(!IFrameSplitOperator.IsNonEmptyArray(this.Lines))return;this.IsHScreen=this.ChartFrame.IsHScreen===true;var xPointCount=this.ChartFrame.XPointCount;var offset=this.Data.DataOffset;var drawLines=[];var arrowLines=[];for(var i=0;i<this.Lines.length;++i){var line=this.Lines[i];var drawPoints={Point:[],Color:line.Color,AryCircle:null};var drawArrowPoints={Start:[],End:[]};if(line.BGColor)drawPoints.BGColor=line.BGColor;if(IFrameSplitOperator.IsNonEmptyArray(line.Circle))drawPoints.AryCircle=line.Circle;var isExtendLine=false;if(IFrameSplitOperator.IsBool(line.IsExtendLine))isExtendLine=line.IsExtendLine;if(isExtendLine)//左右延申
 {var prePoint=null;var bFirstPoint=true;for(var j=0;j<line.Point.length;++j){var point=line.Point[j];if(!IFrameSplitOperator.IsNumber(point.Index))continue;var index=point.Index-offset;if(index>0&&index<xPointCount){if(bFirstPoint){if(prePoint){var preIndex=prePoint.Index-offset;var x=this.ChartFrame.GetXFromIndex(preIndex,false);var y=this.ChartFrame.GetYFromData(prePoint.Value,false);var pointItem={X:x,Y:y,End:false};drawPoints.Point.push(pointItem);}bFirstPoint=false;}var x=this.ChartFrame.GetXFromIndex(index,false);var y=this.ChartFrame.GetYFromData(point.Value,false);var pointItem={X:x,Y:y,End:false};drawPoints.Point.push(pointItem);}else{if(drawPoints.Point.length>0){var x=this.ChartFrame.GetXFromIndex(index,false);var y=this.ChartFrame.GetYFromData(point.Value,false);var pointItem={X:x,Y:y,End:true};drawPoints.Point.push(pointItem);bFirstPoint=true;prePoint=null;}}prePoint=point;}if(drawPoints.Point.length>=2){drawLines.push(drawPoints);arrowLines.push(drawArrowPoints);}}else{for(var j=0;j<line.Point.length;++j){var point=line.Point[j];if(!IFrameSplitOperator.IsNumber(point.Index))continue;var index=point.Index-offset;if(index>=0&&index<xPointCount){var x=this.ChartFrame.GetXFromIndex(index);var y=this.ChartFrame.GetYFromData(point.Value,false);var pointItem={X:x,Y:y,End:false};drawPoints.Point.push(pointItem);if(j==0||j==1)drawArrowPoints.Start.push(pointItem);//起始点
 if(j==line.Point.length-1||j==line.Point.length-2)drawArrowPoints.End.push(pointItem);//结束点
 }else{if(drawPoints.Point.length>0)drawPoints.Point[drawPoints.Point.length-1].End=true;//点断开
-}}if(drawPoints.Point.length>=2){drawLines.push(drawPoints);arrowLines.push(drawArrowPoints);}}}var pixelRatio=GetDevicePixelRatio();this.Canvas.save();this.ClipClient(this.IsHScreen);for(var i=0;i<drawLines.length;++i){if(this.LineDash)this.Canvas.setLineDash(this.LineDash);if(IFrameSplitOperator.IsPlusNumber(this.LineWidth))this.Canvas.lineWidth=this.LineWidth*pixelRatio;else this.Canvas.lineWidth=1*pixelRatio;var item=drawLines[i];this.DrawLine(item,arrowLines[i]);}this.Canvas.restore();};this.DrawLine=function(line,arrow){if(line.BGColor)//背景色
+}}if(drawPoints.Point.length>=2){drawLines.push(drawPoints);arrowLines.push(drawArrowPoints);}}}var pixelRatio=GetDevicePixelRatio();this.Canvas.save();this.ClipClient(this.IsHScreen);//绘制线段
+for(var i=0;i<drawLines.length;++i){if(this.LineDash)this.Canvas.setLineDash(this.LineDash);if(IFrameSplitOperator.IsPlusNumber(this.LineWidth))this.Canvas.lineWidth=this.LineWidth*pixelRatio;else this.Canvas.lineWidth=1*pixelRatio;var item=drawLines[i];this.DrawLine(item,arrowLines[i]);//绘制圆点
+if(item.AryCircle)this.DrawCircle(item);}this.Canvas.restore();};this.DrawCircle=function(line){var pixelRatio=GetDevicePixelRatio();for(var i=0;i<line.Point.length;++i){var item=line.Point[i];for(var j=0;j<line.AryCircle.length;++j){var circleItem=line.AryCircle[j];var type=0;if(IFrameSplitOperator.IsNumber(circleItem.Type))type=circleItem.Type;this.Canvas.beginPath();this.Canvas.arc(item.X,item.Y,circleItem.Radius,0,2*Math.PI);if(type==1){if(IFrameSplitOperator.IsPlusNumber(circleItem.LineWidth))this.Canvas.lineWidth=circleItem.LineWidth*pixelRatio;this.Canvas.strokeStyle=circleItem.Color;this.Canvas.stroke();}else{this.Canvas.fillStyle=circleItem.Color;this.Canvas.fill();}}}};this.DrawLine=function(line,arrow){if(line.BGColor)//背景色
 {this.Canvas.fillStyle=line.BGColor;for(var i=0;i<line.Point.length;++i){var item=line.Point[i];if(i==0){this.Canvas.beginPath();if(this.IsHScreen)this.Canvas.moveTo(item.Y,item.X);else this.Canvas.moveTo(item.X,item.Y);}else{if(this.IsHScreen)this.Canvas.lineTo(item.Y,item.X);else this.Canvas.lineTo(item.X,item.Y);}}this.Canvas.closePath();this.Canvas.fill();}this.Canvas.strokeStyle=line.Color;var drawCount=0;for(var i=0;i<line.Point.length;++i){var item=line.Point[i];if(drawCount==0){this.Canvas.beginPath();if(this.IsHScreen)this.Canvas.moveTo(item.Y,item.X);else this.Canvas.moveTo(item.X,item.Y);++drawCount;}else{if(this.IsHScreen)this.Canvas.lineTo(item.Y,item.X);else this.Canvas.lineTo(item.X,item.Y);++drawCount;}if(item.End==true)//点断了 要重新画
 {if(drawCount>0)this.Canvas.stroke();drawCount=0;}}if(drawCount>0)this.Canvas.stroke();//绘制箭头
 if(arrow.End.length==2&&this.Arrow.End==true)this.DrawArrow(arrow.End[0],arrow.End[1]);if(arrow.Start.length==2&&this.Arrow.Start==true)this.DrawArrow(arrow.Start[1],arrow.Start[0]);};this.DrawArrow=function(ptStart,ptEnd){//计算箭头
@@ -12563,7 +12566,7 @@ this.AreaColor=g_JSChartResource.ScrollBar.BGChart.AreaColor;//面积图颜色
 };this.Draw=function(){if(!this.Data||!IFrameSplitOperator.IsNonEmptyArray(this.Data.Data))return;this.Canvas.save();if(this.LineWidth>0)this.Canvas.lineWidth=this.LineWidth*GetDevicePixelRatio();var bottom=this.ChartBorder.GetBottom();this.Canvas.strokeStyle=this.Color;var bFirstPoint=true;var drawCount=0,x,y;var firstPoint={};for(var i=0;i<this.Data.Data.length;++i){var item=this.Data.Data[i];var value=item.Close;if(!IFrameSplitOperator.IsNumber(value))continue;x=this.ChartFrame.GetXFromIndex(i);y=this.ChartFrame.GetYFromData(value);if(bFirstPoint){this.Canvas.beginPath();this.Canvas.moveTo(x,y);bFirstPoint=false;firstPoint={X:x,Y:y};}else{this.Canvas.lineTo(x,y);}++drawCount;}if(drawCount>0){this.Canvas.stroke();this.Canvas.lineTo(x,bottom);this.Canvas.lineTo(firstPoint.X,bottom);this.Canvas.closePath();this.Canvas.fillStyle=this.AreaColor;this.Canvas.fill();}this.Canvas.restore();};this.GetMaxMin=function(){var range={Max:null,Min:null};if(!this.Data||!IFrameSplitOperator.IsNonEmptyArray(this.Data.Data))return range;for(var i=0;i<this.Data.Data.length;++i){var item=this.Data.Data[i];var value=item.Close;if(!IFrameSplitOperator.IsNumber(value))continue;if(range.Max==null||range.Max<value)range.Max=value;if(range.Min==null||range.Min>value)range.Min=value;}return range;};}/********************************************************************************
  *  版本信息输出
  * 
- */var HQCHART_VERSION="1.1.12386";function PrintHQChartVersion(){var log='*************************************************************************************************************\n*\n*   HQChart                                             Ver: '+HQCHART_VERSION+' \n*                             \n*   License: Apache License 2.0                                                                              \n*   Source: https://github.com/jones2000/HQChart\n*\n*************************************************************************************************************\n';console.log(log);}PrintHQChartVersion();//把给外界调用的方法暴露出来
+ */var HQCHART_VERSION="1.1.12390";function PrintHQChartVersion(){var log='*************************************************************************************************************\n*\n*   HQChart                                             Ver: '+HQCHART_VERSION+' \n*                             \n*   License: Apache License 2.0                                                                              \n*   Source: https://github.com/jones2000/HQChart\n*\n*************************************************************************************************************\n';console.log(log);}PrintHQChartVersion();//把给外界调用的方法暴露出来
 exports.default=(_jsChartInit$jsChartS={jsChartInit:JSChart.Init,jsChartStyle:JSChart.SetStyle,// IsIndexSymbol:IsIndexSymbol,
 // BaseIndex:BaseIndex,
 // ChartLine:ChartLine,

package/package.json

@@ -2,7 +2,7 @@
   "name": "hqchart",
   "description": "stock chart",
   "author": "jones2000",
-  "version": "1.1.12387",
+  "version": "1.1.12391",
   "main": "lib/main.js",
   "private": false,
   "license": "Apache License 2.0",

package/src/jscommon/umychart.js

@@ -56,7 +56,7 @@ function JSChart(divElement, bOffscreen, bCacheCanvas)
     //额外的画布
     this.MapExtraCanvasElement=new Map();   //key=画布名字, value={ Element:, Canvas:}
 
-    this.CreateExtraCanvasElement=function(name)
+    this.CreateExtraCanvasElement=function(name, option)
     {
         if (this.MapExtraCanvasElement.has(name)) return this.MapExtraCanvasElement.get(name);
 
@@ -77,6 +77,11 @@ function JSChart(divElement, bOffscreen, bCacheCanvas)
             element.style["pointer-events"]="none";
         }
 
+        if (option)
+        {
+            if (IFrameSplitOperator.IsNumber(option.TabIndex))  element.setAttribute("tabindex",option.TabIndex);
+        }
+
         divElement.appendChild(element);
 
         var item={ Element:element, Canvas:null };
@@ -2469,6 +2474,10 @@ var JSCHART_EVENT_ID=
     ON_RECV_REALTIME_DATA:109,          //实时数据
 
     ON_CUSTOM_OVERLAY_TOOLBAR:110,          //自定义叠加指标按钮
+
+    //绘图之前的事件
+    ON_BEFORE_DRAW:111,                 
+    ON_BEFORE_DRAW_DYNAMIC_INFO:112,
 }
 
 var JSCHART_OPERATOR_ID=
@@ -4786,6 +4795,13 @@ function JSChartContainer(uielement, OffscreenElement, cacheElement)
 
         this.StopDrawDynamicInfo();
 
+        var event=this.GetEventCallback(JSCHART_EVENT_ID.ON_BEFORE_DRAW);
+        if (event && event.Callback)
+        {
+            var sendData={ };
+            event.Callback(event,sendData,this);
+        }
+
         this.Canvas.clearRect(0,0,this.UIElement.width,this.UIElement.height);
         if (this.CacheCanvas) this.CacheCanvas.clearRect(0,0,this.UIElement.width,this.UIElement.height);
 
@@ -5210,6 +5226,13 @@ function JSChartContainer(uielement, OffscreenElement, cacheElement)
 
         if (this.Frame.ScreenImageData==null && !this.CacheCanvas) return;
 
+        var event=this.GetEventCallback(JSCHART_EVENT_ID.ON_BEFORE_DRAW_DYNAMIC_INFO);
+        if (event && event.Callback)
+        {
+            var sendData={ };
+            event.Callback(event,sendData,this);
+        }
+
         var isErase=false;
         if (this.ChartCorssCursor)
         {
@@ -34046,11 +34069,14 @@ function ChartMultiLine()
         for(var i=0; i<this.Lines.length; ++i)
         {
             var line=this.Lines[i];
-            var drawPoints={ Point:[], Color:line.Color };
+            var drawPoints={ Point:[], Color:line.Color, AryCircle:null };
             var drawArrowPoints={ Start:[], End:[] };
             if (line.BGColor) drawPoints.BGColor=line.BGColor;
+            if (IFrameSplitOperator.IsNonEmptyArray(line.Circle)) drawPoints.AryCircle=line.Circle;
+
             var isExtendLine=false;
             if (IFrameSplitOperator.IsBool(line.IsExtendLine)) isExtendLine=line.IsExtendLine;
+           
             if (isExtendLine)   //左右延申
             {
                 var prePoint=null;
@@ -34122,6 +34148,7 @@ function ChartMultiLine()
                         var x=this.ChartFrame.GetXFromIndex(index);
                         var y=this.ChartFrame.GetYFromData(point.Value, false);
                         var pointItem={X:x, Y:y, End:false};
+
                         drawPoints.Point.push(pointItem);
     
                         if (j==0 || j==1) drawArrowPoints.Start.push(pointItem);    //起始点
@@ -34144,6 +34171,7 @@ function ChartMultiLine()
         var pixelRatio=GetDevicePixelRatio();
         this.Canvas.save();
         this.ClipClient(this.IsHScreen);
+        //绘制线段
         for(var i=0; i<drawLines.length; ++i)
         {
             if (this.LineDash) this.Canvas.setLineDash(this.LineDash);
@@ -34151,10 +34179,48 @@ function ChartMultiLine()
             else this.Canvas.lineWidth=1*pixelRatio;
             var item=drawLines[i];
             this.DrawLine(item, arrowLines[i]);
+
+            //绘制圆点
+            if (item.AryCircle) this.DrawCircle(item)
         }
+
         this.Canvas.restore();
     }
 
+    this.DrawCircle=function(line)
+    {
+        var pixelRatio=GetDevicePixelRatio();
+        
+        for(var i=0; i<line.Point.length; ++i)
+        {
+            var item=line.Point[i];
+
+            for(var j=0;j<line.AryCircle.length;++j)
+            {
+                var circleItem=line.AryCircle[j];
+                
+                var type=0;
+                if (IFrameSplitOperator.IsNumber(circleItem.Type)) type=circleItem.Type;
+                
+                this.Canvas.beginPath();
+                this.Canvas.arc(item.X, item.Y, circleItem.Radius, 0, 2 * Math.PI);
+
+                if (type==1)
+                {
+                    if (IFrameSplitOperator.IsPlusNumber(circleItem.LineWidth)) this.Canvas.lineWidth=circleItem.LineWidth*pixelRatio;
+                    this.Canvas.strokeStyle=circleItem.Color;
+                    this.Canvas.stroke();
+                }
+                else
+                {
+                    this.Canvas.fillStyle=circleItem.Color;
+                    this.Canvas.fill()
+                }
+                
+            }
+        }
+    }
+
     this.DrawLine=function(line, arrow)
     {
         if (line.BGColor)   //背景色

package/src/jscommon/umychart.uniapp.h5/umychart.uniapp.h5.js

@@ -4136,7 +4136,7 @@ function JSChart(divElement, bOffscreen, bCacheCanvas)
     //额外的画布
     this.MapExtraCanvasElement=new Map();   //key=画布名字, value={ Element:, Canvas:}
 
-    this.CreateExtraCanvasElement=function(name)
+    this.CreateExtraCanvasElement=function(name, option)
     {
         if (this.MapExtraCanvasElement.has(name)) return this.MapExtraCanvasElement.get(name);
 
@@ -4157,6 +4157,11 @@ function JSChart(divElement, bOffscreen, bCacheCanvas)
             element.style["pointer-events"]="none";
         }
 
+        if (option)
+        {
+            if (IFrameSplitOperator.IsNumber(option.TabIndex))  element.setAttribute("tabindex",option.TabIndex);
+        }
+
         divElement.appendChild(element);
 
         var item={ Element:element, Canvas:null };
@@ -6549,6 +6554,10 @@ var JSCHART_EVENT_ID=
     ON_RECV_REALTIME_DATA:109,          //实时数据
 
     ON_CUSTOM_OVERLAY_TOOLBAR:110,          //自定义叠加指标按钮
+
+    //绘图之前的事件
+    ON_BEFORE_DRAW:111,                 
+    ON_BEFORE_DRAW_DYNAMIC_INFO:112,
 }
 
 var JSCHART_OPERATOR_ID=
@@ -8866,6 +8875,13 @@ function JSChartContainer(uielement, OffscreenElement, cacheElement)
 
         this.StopDrawDynamicInfo();
 
+        var event=this.GetEventCallback(JSCHART_EVENT_ID.ON_BEFORE_DRAW);
+        if (event && event.Callback)
+        {
+            var sendData={ };
+            event.Callback(event,sendData,this);
+        }
+
         this.Canvas.clearRect(0,0,this.UIElement.width,this.UIElement.height);
         if (this.CacheCanvas) this.CacheCanvas.clearRect(0,0,this.UIElement.width,this.UIElement.height);
 
@@ -9290,6 +9306,13 @@ function JSChartContainer(uielement, OffscreenElement, cacheElement)
 
         if (this.Frame.ScreenImageData==null && !this.CacheCanvas) return;
 
+        var event=this.GetEventCallback(JSCHART_EVENT_ID.ON_BEFORE_DRAW_DYNAMIC_INFO);
+        if (event && event.Callback)
+        {
+            var sendData={ };
+            event.Callback(event,sendData,this);
+        }
+
         var isErase=false;
         if (this.ChartCorssCursor)
         {
@@ -38126,11 +38149,14 @@ function ChartMultiLine()
         for(var i=0; i<this.Lines.length; ++i)
         {
             var line=this.Lines[i];
-            var drawPoints={ Point:[], Color:line.Color };
+            var drawPoints={ Point:[], Color:line.Color, AryCircle:null };
             var drawArrowPoints={ Start:[], End:[] };
             if (line.BGColor) drawPoints.BGColor=line.BGColor;
+            if (IFrameSplitOperator.IsNonEmptyArray(line.Circle)) drawPoints.AryCircle=line.Circle;
+
             var isExtendLine=false;
             if (IFrameSplitOperator.IsBool(line.IsExtendLine)) isExtendLine=line.IsExtendLine;
+           
             if (isExtendLine)   //左右延申
             {
                 var prePoint=null;
@@ -38202,6 +38228,7 @@ function ChartMultiLine()
                         var x=this.ChartFrame.GetXFromIndex(index);
                         var y=this.ChartFrame.GetYFromData(point.Value, false);
                         var pointItem={X:x, Y:y, End:false};
+
                         drawPoints.Point.push(pointItem);
     
                         if (j==0 || j==1) drawArrowPoints.Start.push(pointItem);    //起始点
@@ -38224,6 +38251,7 @@ function ChartMultiLine()
         var pixelRatio=GetDevicePixelRatio();
         this.Canvas.save();
         this.ClipClient(this.IsHScreen);
+        //绘制线段
         for(var i=0; i<drawLines.length; ++i)
         {
             if (this.LineDash) this.Canvas.setLineDash(this.LineDash);
@@ -38231,10 +38259,48 @@ function ChartMultiLine()
             else this.Canvas.lineWidth=1*pixelRatio;
             var item=drawLines[i];
             this.DrawLine(item, arrowLines[i]);
+
+            //绘制圆点
+            if (item.AryCircle) this.DrawCircle(item)
         }
+
         this.Canvas.restore();
     }
 
+    this.DrawCircle=function(line)
+    {
+        var pixelRatio=GetDevicePixelRatio();
+        
+        for(var i=0; i<line.Point.length; ++i)
+        {
+            var item=line.Point[i];
+
+            for(var j=0;j<line.AryCircle.length;++j)
+            {
+                var circleItem=line.AryCircle[j];
+                
+                var type=0;
+                if (IFrameSplitOperator.IsNumber(circleItem.Type)) type=circleItem.Type;
+                
+                this.Canvas.beginPath();
+                this.Canvas.arc(item.X, item.Y, circleItem.Radius, 0, 2 * Math.PI);
+
+                if (type==1)
+                {
+                    if (IFrameSplitOperator.IsPlusNumber(circleItem.LineWidth)) this.Canvas.lineWidth=circleItem.LineWidth*pixelRatio;
+                    this.Canvas.strokeStyle=circleItem.Color;
+                    this.Canvas.stroke();
+                }
+                else
+                {
+                    this.Canvas.fillStyle=circleItem.Color;
+                    this.Canvas.fill()
+                }
+                
+            }
+        }
+    }
+
     this.DrawLine=function(line, arrow)
     {
         if (line.BGColor)   //背景色
@@ -127361,7 +127427,7 @@ function ScrollBarBGChart()
 
 
 
-var HQCHART_VERSION="1.1.12386";
+var HQCHART_VERSION="1.1.12390";
 
 function PrintHQChartVersion()
 {

package/src/jscommon/umychart.version.js

@@ -5,7 +5,7 @@
 
 
 
-var HQCHART_VERSION="1.1.12386";
+var HQCHART_VERSION="1.1.12390";
 
 function PrintHQChartVersion()
 {

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

@@ -4180,7 +4180,7 @@ function JSChart(divElement, bOffscreen, bCacheCanvas)
     //额外的画布
     this.MapExtraCanvasElement=new Map();   //key=画布名字, value={ Element:, Canvas:}
 
-    this.CreateExtraCanvasElement=function(name)
+    this.CreateExtraCanvasElement=function(name, option)
     {
         if (this.MapExtraCanvasElement.has(name)) return this.MapExtraCanvasElement.get(name);
 
@@ -4201,6 +4201,11 @@ function JSChart(divElement, bOffscreen, bCacheCanvas)
             element.style["pointer-events"]="none";
         }
 
+        if (option)
+        {
+            if (IFrameSplitOperator.IsNumber(option.TabIndex))  element.setAttribute("tabindex",option.TabIndex);
+        }
+
         divElement.appendChild(element);
 
         var item={ Element:element, Canvas:null };
@@ -6593,6 +6598,10 @@ var JSCHART_EVENT_ID=
     ON_RECV_REALTIME_DATA:109,          //实时数据
 
     ON_CUSTOM_OVERLAY_TOOLBAR:110,          //自定义叠加指标按钮
+
+    //绘图之前的事件
+    ON_BEFORE_DRAW:111,                 
+    ON_BEFORE_DRAW_DYNAMIC_INFO:112,
 }
 
 var JSCHART_OPERATOR_ID=
@@ -8910,6 +8919,13 @@ function JSChartContainer(uielement, OffscreenElement, cacheElement)
 
         this.StopDrawDynamicInfo();
 
+        var event=this.GetEventCallback(JSCHART_EVENT_ID.ON_BEFORE_DRAW);
+        if (event && event.Callback)
+        {
+            var sendData={ };
+            event.Callback(event,sendData,this);
+        }
+
         this.Canvas.clearRect(0,0,this.UIElement.width,this.UIElement.height);
         if (this.CacheCanvas) this.CacheCanvas.clearRect(0,0,this.UIElement.width,this.UIElement.height);
 
@@ -9334,6 +9350,13 @@ function JSChartContainer(uielement, OffscreenElement, cacheElement)
 
         if (this.Frame.ScreenImageData==null && !this.CacheCanvas) return;
 
+        var event=this.GetEventCallback(JSCHART_EVENT_ID.ON_BEFORE_DRAW_DYNAMIC_INFO);
+        if (event && event.Callback)
+        {
+            var sendData={ };
+            event.Callback(event,sendData,this);
+        }
+
         var isErase=false;
         if (this.ChartCorssCursor)
         {
@@ -38170,11 +38193,14 @@ function ChartMultiLine()
         for(var i=0; i<this.Lines.length; ++i)
         {
             var line=this.Lines[i];
-            var drawPoints={ Point:[], Color:line.Color };
+            var drawPoints={ Point:[], Color:line.Color, AryCircle:null };
             var drawArrowPoints={ Start:[], End:[] };
             if (line.BGColor) drawPoints.BGColor=line.BGColor;
+            if (IFrameSplitOperator.IsNonEmptyArray(line.Circle)) drawPoints.AryCircle=line.Circle;
+
             var isExtendLine=false;
             if (IFrameSplitOperator.IsBool(line.IsExtendLine)) isExtendLine=line.IsExtendLine;
+           
             if (isExtendLine)   //左右延申
             {
                 var prePoint=null;
@@ -38246,6 +38272,7 @@ function ChartMultiLine()
                         var x=this.ChartFrame.GetXFromIndex(index);
                         var y=this.ChartFrame.GetYFromData(point.Value, false);
                         var pointItem={X:x, Y:y, End:false};
+
                         drawPoints.Point.push(pointItem);
     
                         if (j==0 || j==1) drawArrowPoints.Start.push(pointItem);    //起始点
@@ -38268,6 +38295,7 @@ function ChartMultiLine()
         var pixelRatio=GetDevicePixelRatio();
         this.Canvas.save();
         this.ClipClient(this.IsHScreen);
+        //绘制线段
         for(var i=0; i<drawLines.length; ++i)
         {
             if (this.LineDash) this.Canvas.setLineDash(this.LineDash);
@@ -38275,10 +38303,48 @@ function ChartMultiLine()
             else this.Canvas.lineWidth=1*pixelRatio;
             var item=drawLines[i];
             this.DrawLine(item, arrowLines[i]);
+
+            //绘制圆点
+            if (item.AryCircle) this.DrawCircle(item)
         }
+
         this.Canvas.restore();
     }
 
+    this.DrawCircle=function(line)
+    {
+        var pixelRatio=GetDevicePixelRatio();
+        
+        for(var i=0; i<line.Point.length; ++i)
+        {
+            var item=line.Point[i];
+
+            for(var j=0;j<line.AryCircle.length;++j)
+            {
+                var circleItem=line.AryCircle[j];
+                
+                var type=0;
+                if (IFrameSplitOperator.IsNumber(circleItem.Type)) type=circleItem.Type;
+                
+                this.Canvas.beginPath();
+                this.Canvas.arc(item.X, item.Y, circleItem.Radius, 0, 2 * Math.PI);
+
+                if (type==1)
+                {
+                    if (IFrameSplitOperator.IsPlusNumber(circleItem.LineWidth)) this.Canvas.lineWidth=circleItem.LineWidth*pixelRatio;
+                    this.Canvas.strokeStyle=circleItem.Color;
+                    this.Canvas.stroke();
+                }
+                else
+                {
+                    this.Canvas.fillStyle=circleItem.Color;
+                    this.Canvas.fill()
+                }
+                
+            }
+        }
+    }
+
     this.DrawLine=function(line, arrow)
     {
         if (line.BGColor)   //背景色
@@ -127405,7 +127471,7 @@ function ScrollBarBGChart()
 
 
 
-var HQCHART_VERSION="1.1.12386";
+var HQCHART_VERSION="1.1.12390";
 
 function PrintHQChartVersion()
 {