hqchart 1.1.13144 → 1.1.13155

package/package.json

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

package/src/jscommon/umychart.js

@@ -18590,7 +18590,34 @@ function HQTradeHScreenFrame()
             }
         }
 
-        if (frame!=null) return frame.GetYData(x);
+        if (frame!=null) 
+        {
+            var xValue= frame.GetYData(x);
+
+            if (frame.GetMainOverlayFrame)
+            {
+                var aryOverlayFrame=frame.GetMainOverlayFrame();
+                if (aryOverlayFrame) 
+                {
+                    if (aryOverlayFrame[0]) //左侧
+                    {
+                        var leftFrame=aryOverlayFrame[0];
+                        var value=leftFrame.GetYData(x);
+                        outObject.RightYValue=xValue;
+                        xValue=value;
+                    }
+
+                    if (aryOverlayFrame[1]) //右侧
+                    {
+                        var rightFrame=aryOverlayFrame[1];
+                        var value=rightFrame.GetYData(x);
+                        outObject.RightYValue=value;
+                    }
+                }
+            }
+            
+            return xValue;
+        }
     }
 }
 
@@ -24713,6 +24740,198 @@ function ChartKLine()
         this.PtMin=ptMin;
     }
 
+    this.DrawKagi=function()    //卡吉图
+    {
+        var isHScreen=(this.ChartFrame.IsHScreen===true);
+        var dataWidth=this.ChartFrame.DataWidth;
+        var distanceWidth=this.ChartFrame.DistanceWidth;
+        var xPointCount=this.ChartFrame.XPointCount;
+
+        if (isHScreen)
+        {
+            var border=this.ChartBorder.GetHScreenBorder();
+            var xOffset=border.TopEx+distanceWidth/2.0+g_JSChartResource.FrameLeftMargin;
+            var chartright=border.BottomEx;
+            var left=border.TopEx+g_JSChartResource.FrameLeftMargin;
+        }
+        else
+        {
+            var border=this.ChartBorder.GetBorder();
+            var xOffset=border.LeftEx+distanceWidth/2.0+g_JSChartResource.FrameLeftMargin;
+            var chartright=border.RightEx;
+            var left=border.Left+g_JSChartResource.FrameLeftMargin;
+        }
+
+        var ptMax={X:null,Y:null,Value:null,Align:'left'};
+        var ptMin={X:null,Y:null,Value:null,Align:'left'};
+        this.ShowRange.Start=this.Data.DataOffset;
+        this.ShowRange.End=this.ShowRange.Start;
+        this.ShowRange.DataCount=0;
+        this.ShowRange.ShowCount=xPointCount;
+        this.DrawKRange.Start=this.Data.DataOffset;
+
+        var lineWidth=2*GetDevicePixelRatio();
+        this.Canvas.lineWidth=lineWidth;
+        var preItem={ Item:null, X:left, Y:null };
+        var index=this.Data.DataOffset-1;
+        if (index>=0 && index<this.Data.Data.length)
+        {
+            var item=this.Data.Data[index];
+            preItem.Item=item;
+            if (item.Direction==1)  //上
+            {
+                preItem.Y=this.GetYFromData(item.High,false);
+            }
+            else if (item.Direction==2)
+            {
+                preItem.Y=this.GetYFromData(item.Low,false);
+            }
+        } 
+
+
+        for(var i=this.Data.DataOffset,j=0;i<this.Data.Data.length && j<xPointCount;++i,++j,xOffset+=(dataWidth+distanceWidth),++this.ShowRange.DataCount)
+        {
+            var data=this.Data.Data[i];
+            this.ShowRange.End=i;
+            if (data.Open==null || data.High==null || data.Low==null || data.Close==null) continue;
+
+            var left=xOffset;
+            var right=xOffset+dataWidth;
+            if (right>chartright) break;
+            var x=left+(right-left)/2;
+            var yLow=this.GetYFromData(data.Low,false);
+            var yHigh=this.GetYFromData(data.High,false);
+            this.DrawKRange.End=i;
+
+            if (ptMax.Value==null || ptMax.Value<data.High)     //求最大值
+            {
+                ptMax.X=x;
+                ptMax.Y=yHigh;
+                ptMax.Value=data.High;
+                ptMax.Align=j<xPointCount/2?'left':'right';
+            }
+
+            if (ptMin.Value==null || ptMin.Value>data.Low)      //求最小值
+            {
+                ptMin.X=x;
+                ptMin.Y=yLow;
+                ptMin.Value=data.Low;
+                ptMin.Align=j<xPointCount/2?'left':'right';
+            }
+
+            var xFixed=ToFixedPoint2(lineWidth,x);
+
+            if (preItem.Item)
+            {
+                this.Canvas.beginPath();
+                var yFixed=ToFixedPoint2(lineWidth,preItem.Y);
+
+                this.Canvas.moveTo(preItem.X, yFixed);
+                this.Canvas.lineTo(xFixed, yFixed);
+                var prePrice=null;
+                if (preItem.Item.Direction==1) prePrice=preItem.Item.Low;
+                else if (preItem.Item.Direction==2) prePrice=preItem.Item.High;
+
+                if (data.Direction==1)
+                {
+                    if (data.High<prePrice)
+                    {
+                        this.Canvas.lineTo(xFixed, yHigh);
+                        this.Canvas.strokeStyle=this.DownColor; 
+                        this.Canvas.stroke();
+                    }
+                    else
+                    {
+                        var yPrePrice=this.GetYFromData(prePrice,false);
+                        this.Canvas.lineTo(xFixed, yPrePrice);
+                        this.Canvas.strokeStyle=this.DownColor; 
+                        this.Canvas.stroke();
+
+                        this.Canvas.beginPath();
+                        this.Canvas.moveTo(xFixed, yPrePrice);
+                        this.Canvas.lineTo(xFixed, yHigh);
+                        this.Canvas.strokeStyle=this.UpColor; 
+                        this.Canvas.stroke();
+                    }
+                        
+                }
+                else if (data.Direction==2)
+                {
+                    if (data.Low>prePrice)
+                    {
+                        this.Canvas.lineTo(xFixed, yLow);
+                        this.Canvas.strokeStyle=this.DownColor; //阳线
+                        this.Canvas.stroke();
+                    }
+                    else
+                    {
+                        var yPrePrice=this.GetYFromData(prePrice,false);
+                        this.Canvas.lineTo(xFixed, yPrePrice);
+                        this.Canvas.strokeStyle=this.DownColor; //阳线
+                        this.Canvas.stroke();
+
+                        this.Canvas.beginPath();
+                        this.Canvas.moveTo(xFixed, yPrePrice);
+                        this.Canvas.lineTo(xFixed, yLow);
+                        this.Canvas.strokeStyle=this.UpColor; 
+                        this.Canvas.stroke();
+                    }
+                }
+                
+            }
+            else
+            {
+                this.Canvas.beginPath();
+                if (data.Direction==1)
+                {
+                    this.Canvas.moveTo(xFixed, yLow);
+                    this.Canvas.lineTo(xFixed, yHigh);
+                }
+                else if (data.Direction==2)
+                {
+                    this.Canvas.moveTo(xFixed, yHigh);
+                    this.Canvas.lineTo(xFixed, yLow);
+                }
+                this.Canvas.stroke();
+            }
+
+            /*
+            if (data.YClose<data.Close) 
+            {
+                this.Canvas.strokeStyle=this.UpColor; //阳线
+                this.Canvas.fillStyle=this.UpColor;
+            }
+            else if (data.YClose>data.Close) 
+            {
+                this.Canvas.strokeStyle=this.DownColor; //阴线
+                this.Canvas.fillStyle=this.DownColor;
+            }
+            
+            this.Canvas.beginPath();
+            if (isHScreen)
+            {
+                this.Canvas.moveTo(yHigh,ToFixedPoint(x));
+                this.Canvas.lineTo(yLow,ToFixedPoint(x));
+            }
+            else
+            {
+                this.Canvas.moveTo(ToFixedPoint2(lineWidth,x),yHigh);
+                this.Canvas.lineTo(ToFixedPoint2(lineWidth,x),yLow);
+            }
+            this.Canvas.stroke();
+            */
+
+            preItem.Item=data;
+            preItem.X=x;
+
+            if (data.Direction==1)  preItem.Y=yHigh;    //上
+            else if (data.Direction==2) preItem.Y=yLow  //下
+        }
+
+        this.PtMax=ptMax;
+        this.PtMin=ptMin;
+    }
+
     this.DrawTrade=function()       //交易系统
     {
         if (!this.TradeData) return;
@@ -25220,6 +25439,10 @@ function ChartKLine()
         {
             this.DrawHLCArea();
         }
+        else if (this.DrawType==16)
+        {
+            this.DrawKagi();
+        }
         else if (this.DrawType==17)
         {
             this.DrawOrderFlow_Style4();
@@ -48319,6 +48542,7 @@ function ChartCorssCursor()
 
         this.StringFormatY.Value=yValue;
         this.StringFormatY.FrameID=yValueExtend.FrameID;
+        this.StringFormatY.RValue=yValueExtend.RightYValue; //右侧子坐标
         this.StringFormatY.Point={X:x, Y:y};
         this.StringFormatY.ClientPos=this.ClientPos;
 
@@ -49123,6 +49347,7 @@ function HQPriceStringFormat()
         {
             if (this.DataFormatType==1) this.Text=IFrameSplitOperator.FormatValueThousandsString(this.Value,defaultfloatPrecision);
             else this.Text=IFrameSplitOperator.FormatValueString(this.Value,defaultfloatPrecision,this.LanguageID);
+            if (IFrameSplitOperator.IsNumber(this.RValue)) this.RText=IFrameSplitOperator.FormatValueString(this.RValue,defaultfloatPrecision,this.LanguageID);
         }
 
         if (this.GetEventCallback)
@@ -64368,7 +64593,11 @@ function JSChartResource()
             DateFont:`${14*GetDevicePixelRatio()}px 微软雅黑`,
             DateColor:'rgb(0,0,0)',
             BarColor:"rgb(207,207,207)",
-            BarAreaColor:"rgba(232,232,232,0.65)"
+            BarAreaColor:"rgba(232,232,232,0.65)",
+
+            BarWidth:10,
+            BarPadding:15,  //上下留白
+            MinCenterWidth:15
         }
     },
 
@@ -65013,6 +65242,9 @@ function JSChartResource()
                 if (subItem.DateColor) this.ScrollBar.Slider.DateColor=subItem.DateColor;
                 if (subItem.BarColor) this.ScrollBar.Slider.BarColor=subItem.BarColor;
                 if (subItem.BarAreaColor) this.ScrollBar.Slider.BarAreaColor=subItem.BarAreaColor;
+                if (IFrameSplitOperator.IsNumber(subItem.BarWidth)) this.ScrollBar.Slider.BarWidth=subItem.BarWidth;
+                if (IFrameSplitOperator.IsNumber(subItem.BarPadding)) this.ScrollBar.Slider.BarPadding=subItem.BarPadding;
+                if (IFrameSplitOperator.IsNumber(subItem.MinCenterWidth)) this.ScrollBar.Slider.MinCenterWidth=subItem.MinCenterWidth;
             }
 
             if (item.BGChart)
@@ -65760,20 +65992,24 @@ function RenkoCalculate()
 //
 function KagiCalculate()
 {
-    this.Symbol;
-    this.SourceData;
-    this.FloatPrecision=2;  //品种小数位数
-    this.ATR={ Count:14 };  //使用ATR计算砖块大小
+    this.newMethod=RenkoCalculate;   //派生
+    this.newMethod();
+    delete this.newMethod;
+   
+    this.ClassName="KagiCalculate";
+    this.BrickSizeType=0;   
+    this.BrickSize=0.5;    //固定大小
 
     this.RecvHistoryData=function(sourceData, option)  //历史日线数据
     {
         this.Symbol=option.Symbol;
         this.SourceData=sourceData;
         this.FloatPrecision=GetfloatPrecision(this.Symbol);
-        return this.Calculate(sourceData);
+        if (this.BrickSizeType==1) this.CalculateATR();
+        return this.CalculateByClose(sourceData);
     }
 
-    this.Calculate=function(sourceData)
+    this.CalculateByClose=function(sourceData)
     {
         var bindData=new ChartData();
         bindData.Data=[]
@@ -65784,13 +66020,139 @@ function KagiCalculate()
 
         if (!IFrameSplitOperator.IsNonEmptyArray(sourceData.Data)) return bindData;
 
-        var periodCount=this.ATR.Count;
+        var brickSize=this.BrickSize;
+        if (this.BrickSizeType==1) brickSize=this.ATR.BrickSize;
 
         var kItem=sourceData.Data[0];
-        this.LastData=HistoryData.Copy(kItem);
-        for(var i=1; i<sourceData.Data.length; )    
+        var kagiItem=HistoryData.Copy(kItem);
+        
+        kagiItem.High=kagiItem.Low=kItem.Close;
+        kagiItem.StartItem=kItem;
+        kagiItem.Direction=0;   //1 上 2=下
+
+        var T_MergeKData=function(dest, src)
+        {
+            dest.Vol+=src.Vol;
+            dest.Amount+=src.Amount;
+        }
+
+        var index=1;
+        for( ;index<sourceData.Data.length;++index) //确定好方向
+        {
+            var kItem=sourceData.Data[index];
+            if (kItem.Close>kagiItem.Close) 
+            {
+                kagiItem.Direction=1;
+                kagiItem.Close=kItem.Close;
+                kagiItem.EndItem=kItem;
+                kagiItem.High=kItem.Close;
+                break;
+            }
+            else if (kItem.Close<kagiItem.Close) 
+            {
+                kagiItem.Direction=2;
+                kagiItem.Close=kItem.Close;
+                kagiItem.EndItem=kItem;
+                kagiItem.Low=kItem.Close;
+                break;
+            }
+        }
+
+        var changeItem=null;
+        for(++index; index<sourceData.Data.length;++index )    
+        {
+            var kItem=sourceData.Data[index];
+            if (kagiItem.Direction==1)  //上
+            {
+                if (kItem.Close>=kagiItem.High) 
+                {
+                    kagiItem.Close=kItem.Close;
+                    kagiItem.High=kItem.Close;
+                    kagiItem.EndItem=kItem;
+                    changeItem=null;
+                }
+                else
+                {
+                    if (!changeItem) 
+                    {
+                        changeItem=HistoryData.Copy(kItem);
+                        changeItem.High=changeItem.Low=kItem.Close;
+                    }
+                    else
+                    {
+                        changeItem.Close=kItem.Close;
+                        if (changeItem.Low>kItem.Close) changeItem.Low=kItem.Close;
+                    }
+
+                    if (Math.abs(changeItem.Low-kagiItem.High)>brickSize)   //达到变盘点
+                    {
+                        bindData.Data.push(kagiItem);
+
+                        var newItem=HistoryData.Copy(kItem);
+                        newItem.High=kagiItem.High;
+                        newItem.Low=kItem.Close;
+                        newItem.Direction=2;   //1 上 2=下
+                        newItem.StartItem=kItem;
+
+                        kagiItem=newItem;
+                        changeItem=null;
+                    }
+                }
+            }
+            else if (kagiItem.Direction==2) //下
+            {
+                if (kItem.Close<=kagiItem.Low) 
+                {
+                    kagiItem.Close=kItem.Close;
+                    kagiItem.Low=kItem.Close;
+                    kagiItem.EndItem=kItem;
+                }
+                else
+                {
+                    if (!changeItem) 
+                    {
+                        changeItem=HistoryData.Copy(kItem);
+                        changeItem.High=changeItem.Low=kItem.Close;
+                    }
+                    else
+                    {
+                        changeItem.Close=kItem.Close;
+                        if (changeItem.High<kItem.Close) changeItem.High=kItem.Close;
+                    }
+
+                    if (Math.abs(changeItem.High-kagiItem.Low)>brickSize)   //达到变盘点
+                    {
+                        bindData.Data.push(kagiItem);
+
+                        var newItem=HistoryData.Copy(kItem);
+                        newItem.High=kItem.Close;
+                        newItem.Low=kagiItem.Low;
+                        newItem.Direction=1;   //1 上 2=下
+                        newItem.StartItem=kItem;
+
+                        kagiItem=newItem;
+                        changeItem=null;
+                    }
+                }
+            }
+        }
+
+        return bindData;
+    }
+
+    //获取配置信息
+    this.GetTitle=function()
+    {
+        if (this.BrickSizeType==1)
+        {
+            var text=`Kagi [ATR(${this.ATR.Count}), ${this.ATR.BrickSize}]`;
+        }
+        else
         {
+            var text=`Kagi [Traditional]`;
         }
+
+        return text;
     }
 }
 
@@ -66118,8 +66480,8 @@ function KLineChartContainer(uielement,OffscreenElement, cacheElement)
     this.KLineCalculate=null;               //K线定制指标计算
     this.KLineCalcOption=new Map();         //K线定制指标配置
 
-    this.ScrollBar=null;        //横向滚动条
-
+    this.ScrollBar=null;            //横向滚动条
+    this.IsAutoSyncDataOffset=true; //增量更新时,是否移动当前屏数据
 
     this.GetKLineCalulate=function()
     {
@@ -67346,15 +67708,18 @@ function KLineChartContainer(uielement,OffscreenElement, cacheElement)
         var xPointCount=this.Frame.SubFrame[0].Frame.XPointCount;   //当前一屏能显示的数据个数
 
         var newDataCount=0;
-        if (lastDataCount>0 && hisData.Data.length>lastDataCount)
+        if (IFrameSplitOperator.IsNumber(lastDataCount))
         {
-            newDataCount=hisData.Data.length-lastDataCount;
-            JSConsole.Chart.Log(`[KLineChartContainer::UpdateMainData]  [count=${lastDataCount}->${hisData.Data.length}], [newDataCount=${newDataCount}], [Pagesize=${xPointCount}]`);
-        }
-        else if (lastDataCount==0 && hisData.Data.length>xPointCount)   //历史数据为空,当前收到数据大于一屏的数据,显示最新数据
-        {
-            newDataCount=hisData.Data.length-xPointCount;
-            JSConsole.Chart.Log(`[KLineChartContainer::UpdateMainData] history data is empty. [count=${lastDataCount}->${hisData.Data.length}], [newDataCount=${newDataCount}], [Pagesize=${xPointCount}]`);
+            if (lastDataCount>0 && hisData.Data.length>lastDataCount)
+            {
+                newDataCount=hisData.Data.length-lastDataCount;
+                JSConsole.Chart.Log(`[KLineChartContainer::UpdateMainData]  [count=${lastDataCount}->${hisData.Data.length}], [newDataCount=${newDataCount}], [Pagesize=${xPointCount}]`);
+            }
+            else if (lastDataCount==0 && hisData.Data.length>xPointCount)   //历史数据为空,当前收到数据大于一屏的数据,显示最新数据
+            {
+                newDataCount=hisData.Data.length-xPointCount;
+                JSConsole.Chart.Log(`[KLineChartContainer::UpdateMainData] history data is empty. [count=${lastDataCount}->${hisData.Data.length}], [newDataCount=${newDataCount}], [Pagesize=${xPointCount}]`);
+            }
         }
 
         this.ChartPaint[0].Data=hisData;
@@ -68746,7 +69111,9 @@ function KLineChartContainer(uielement,OffscreenElement, cacheElement)
         if (!this.SourceData) return;
         if (!this.SourceData.MergeMinuteData(aryMinuteData)) return;
 
-        JSConsole.Chart.Log(`[KLineChartContainer::RecvMinuteRealtimeDataV2] update kline by 1 minute data [${lastDataCount}->${this.SourceData.Data.length}]`);
+        JSConsole.Chart.Log(`[KLineChartContainer::RecvMinuteRealtimeDataV2] update kline by 1 minute data [${lastDataCount}->${this.SourceData.Data.length}], IsAutoSyncDataOffset=${this.IsAutoSyncDataOffset}`);
+
+        if (this.IsAutoSyncDataOffset===false)  lastDataCount=null; //维持当前的屏位置
 
         var bindData=new ChartData();
         bindData.Data=this.SourceData.Data;
@@ -69398,12 +69765,17 @@ function KLineChartContainer(uielement,OffscreenElement, cacheElement)
     //删除某一个窗口的指标, bCallDestory=是否调用图形销毁函数
     this.DeleteIndexPaint=function(windowIndex, bCallDestroy)
     {
-        let paint=new Array();  //踢出当前窗口的指标画法
-        for(let i in this.ChartPaint)
+        if (!this.Frame.SubFrame[windowIndex]) return;
+        var subFrame=this.Frame.SubFrame[windowIndex].Frame;
+        if (!subFrame) return;
+
+        var paint=[];  //踢出当前窗口的指标画法
+        for(var i=0;i<this.ChartPaint.length; ++i)
         {
-            let item=this.ChartPaint[i];
+            var item=this.ChartPaint[i];
+            var bFind=(item.ChartFrame.Guid==subFrame.Guid || item.ChartFrame==subFrame);
 
-            if (i==0 || item.ChartFrame!=this.Frame.SubFrame[windowIndex].Frame)
+            if (i==0 || !bFind)
             {
                 paint.push(item);
             }
@@ -69416,7 +69788,7 @@ function KLineChartContainer(uielement,OffscreenElement, cacheElement)
             }
         }
         
-        var subFrame=this.Frame.SubFrame[windowIndex].Frame;
+        
         subFrame.YSpecificMaxMin=null;    //清空指定最大最小值
         subFrame.IsLocked=false;          //解除上锁
         subFrame.YSplitScale = null;      //清空固定刻度
@@ -75150,6 +75522,7 @@ function MinuteChartContainer(uielement,offscreenElement,cacheElement)
             }
 
             var subFrame=new SubFrameItem();
+            frame.FrameData.SubFrameItem=subFrame;
             subFrame.Frame=frame;
             if (i==0)
                 subFrame.Height=20;
@@ -75236,6 +75609,7 @@ function MinuteChartContainer(uielement,offscreenElement,cacheElement)
         }
 
         var subFrame=new SubFrameItem();
+        frame.FrameData.SubFrameItem=subFrame;
         subFrame.Frame=frame;
         subFrame.Height=10;
 
@@ -75307,12 +75681,16 @@ function MinuteChartContainer(uielement,offscreenElement,cacheElement)
     //删除某一个窗口的指标
     this.DeleteIndexPaint=function(windowIndex,bCallDestroy)
     {
-        let paint=new Array();          //踢出当前窗口的指标画法
-        for(let i in this.ChartPaint)
+        var subFrame=this.Frame.SubFrame[windowIndex].Frame;
+        if (!subFrame) return;
+
+        var paint=[];          //踢出当前窗口的指标画法
+        for(var i=0;i<this.ChartPaint.length;++i)
         {
-            let item=this.ChartPaint[i];
+            var item=this.ChartPaint[i];
+            var bFind=(item.ChartFrame.Guid==subFrame.Guid || item.ChartFrame==subFrame);
 
-            if (i==0 || item.ChartFrame!=this.Frame.SubFrame[windowIndex].Frame)
+            if (i==0 || !bFind)
             {
                 paint.push(item);
             }
@@ -75326,7 +75704,7 @@ function MinuteChartContainer(uielement,offscreenElement,cacheElement)
         }
 
         //清空指定最大最小值
-        var subFrame=this.Frame.SubFrame[windowIndex].Frame;
+        
         subFrame.YSpecificMaxMin=null;
         subFrame.IsLocked=false;          //解除上锁
         subFrame.YSplitOperator.SplitType=subFrame.YSplitOperator.DefaultSplitType;  //还原Y坐标分割模式
@@ -80649,6 +81027,7 @@ function KLineChartHScreenContainer(uielement)
             }
 
             var subFrame=new SubFrameItem();
+            frame.FrameData.SubFrameItem=subFrame;
             subFrame.Frame=frame;
             if (i==0)
                 subFrame.Height=20;
@@ -80793,6 +81172,7 @@ function MinuteChartHScreenContainer(uielement)
             }
 
             var subFrame=new SubFrameItem();
+            frame.FrameData.SubFrameItem=subFrame;
             subFrame.Frame=frame;
             if (i==0)
                 subFrame.Height=20;

package/src/jscommon/umychart.scrollbar.js

@@ -462,11 +462,11 @@ function JSScrollBarChartContainer(uielement)
             switch(item.Data.Type)
             {
                 case 0:
-                    mouseStatus={ Cursor:"move", Name:"SliderChart"};
+                    mouseStatus={ Cursor:"grab", Name:"SliderChart"};
                     break;
                 case 1:
                 case 2:
-                    mouseStatus={ Cursor:"ew-resize", Name:"SliderChart"};
+                    mouseStatus={ Cursor:"col-resize", Name:"SliderChart"};
                     break;
             }
         }
@@ -536,6 +536,10 @@ function JSScrollBarChartContainer(uielement)
                 {
                     xStart=pageRange.First.XStart;
                 }
+                else if (xStart>=right)
+                {
+                    xStart=pageRange.Last.XEnd;
+                }
 
                 this.SliderChart.XStart=xStart;
             }
@@ -545,6 +549,10 @@ function JSScrollBarChartContainer(uielement)
                 {
                     xEnd=pageRange.Last.XEnd;
                 }
+                else if (xEnd<=left)
+                {
+                    xEnd=pageRange.First.XStart;
+                }
 
                 this.SliderChart.XEnd=xEnd;
             }
@@ -1089,8 +1097,9 @@ function SliderChart()
     this.Color=g_JSChartResource.ScrollBar.Slider.BarAreaColor;
 
     this.BarColor=g_JSChartResource.ScrollBar.Slider.BarColor;
-    this.BarWidth=10;
-    this.BarPadding=10;  //上下留白
+    this.BarWidth=g_JSChartResource.ScrollBar.Slider.BarWidth;
+    this.BarPadding=g_JSChartResource.ScrollBar.Slider.BarPadding;  //上下留白
+    this.MinCenterWidth=g_JSChartResource.ScrollBar.Slider.MinCenterWidth;
 
     this.DateFont=g_JSChartResource.ScrollBar.Slider.DateFont;
     this.DateColor=g_JSChartResource.ScrollBar.Slider.DateColor;
@@ -1150,6 +1159,12 @@ function SliderChart()
         var rtBar={ Left:Math.min(xStart,xEnd), Top:top, Width:Math.abs(xEnd-xStart), Height: bottom-top};
         rtBar.Right=rtBar.Left+rtBar.Width;
         rtBar.Bottom=rtBar.Top+rtBar.Height;
+        if (rtBar.Width<this.MinCenterWidth)
+        {
+            rtBar.Left-=(this.MinCenterWidth-rtBar.Width)/2;
+            rtBar.Width=this.MinCenterWidth;
+            rtBar.Right=rtBar.Left+rtBar.Width;
+        }
         this.Canvas.fillRect(rtBar.Left, rtBar.Top, rtBar.Width, rtBar.Height);
         this.AryRect.push({ Rect:rtBar, Type:0});