hqchart 1.1.14523 → 1.1.14533

package/src/jscommon/umychart.report.js

@@ -157,6 +157,7 @@ function JSReportChart(divElement)
         if (option.EnablePopMenuV2===true) chart.InitalPopMenu();
         if (option.FloatTooltip && option.FloatTooltip.Enable) chart.InitalFloatTooltip(option.FloatTooltip);   //提示信息
         if (option.MinuteChartTooltip && option.MinuteChartTooltip.Enable) chart.InitalMinuteChartTooltip(option.MinuteChartTooltip);
+        if (option.KLineChartTooltip && option.KLineChartTooltip.Enable) chart.InitalKLineChartTooltip(option.KLineChartTooltip);
 
         if (option.Symbol) chart.Symbol=option.Symbol;
         if (option.Name) chart.Name=option.Name;
@@ -477,6 +478,7 @@ function JSReportChartContainer(uielement)
 
     //
     this.TooltipMinuteChart;    //分时图
+    this.TooltipKLineChart;     //分时图
 
     //MouseOnStatus:{ RowIndex:行, ColumnIndex:列} 
     this.LastMouseStatus={ MoveStatus:null, TooltipStatus:null, MouseOnStatus:null };
@@ -487,6 +489,7 @@ function JSReportChartContainer(uielement)
         this.StopAutoUpdate();
 
         this.DestroyMinuteChartTooltip();
+        this.DestroyKLineChartTooltip();
         this.DestroyFloatTooltip();
     }
 
@@ -526,6 +529,24 @@ function JSReportChartContainer(uielement)
         this.TooltipMinuteChart=null;
     }
 
+    this.InitalKLineChartTooltip=function(option)
+    {
+        if (this.TooltipKLineChart) return;
+
+        this.TooltipKLineChart=new JSTooltipKLineChart();
+        this.TooltipKLineChart.Inital(this, option);
+        this.TooltipKLineChart.Create();
+    }
+
+    this.DestroyKLineChartTooltip=function()
+    {
+        if (!this.TooltipKLineChart) return;
+
+        this.TooltipKLineChart.Destroy();
+        this.TooltipKLineChart=null;
+    }
+    
+
     this.InitalFloatTooltip=function(option)
     {
         if (this.FloatTooltip) return;
@@ -595,6 +616,35 @@ function JSReportChartContainer(uielement)
     }
 
 
+    this.ShowKLineChartTooltip=function(x,y, data)
+    {
+        if (!this.TooltipKLineChart) return;
+
+        var rtClient=this.UIElement.getBoundingClientRect();
+        var rtScroll=GetScrollPosition();
+
+        var offsetLeft=rtClient.left+rtScroll.Left;
+        var offsetTop=rtClient.top+rtScroll.Top;
+
+        data.Offset={ Left:offsetLeft, Top:offsetTop };
+
+        this.TooltipKLineChart.Show(data, x,y);
+    }
+
+    this.HideKLineChartTooltip=function()
+    {
+        if (!this.TooltipKLineChart) return;
+
+        this.TooltipKLineChart.Hide();
+    }
+
+    this.HideAllTooltip=function()
+    {
+        this.HideKLineChartTooltip();
+        this.HideMinuteChartTooltip();
+        this.HideFloatTooltip();
+    }
+
 
     this.AutoScrollPage=function(step)
     {
@@ -1764,8 +1814,7 @@ function JSReportChartContainer(uielement)
             if (wheelValue<0)   //下
             {
                 this.LastMouseStatus.TooltipStatus=null;
-                this.HideMinuteChartTooltip();
-                this.HideFloatTooltip();
+                this.HideAllTooltip();
                 if (this.GotoNextItem(1))
                 {
                     this.Draw();
@@ -1775,8 +1824,7 @@ function JSReportChartContainer(uielement)
             else if (wheelValue>0)  //上
             {
                 this.LastMouseStatus.TooltipStatus=null;
-                this.HideMinuteChartTooltip();
-                this.HideFloatTooltip();
+                this.HideAllTooltip();
                 if (this.GotoNextItem(-1))
                 {
                     this.Draw();
@@ -1789,8 +1837,7 @@ function JSReportChartContainer(uielement)
             if (wheelValue<0)   //下一页
             {
                 this.LastMouseStatus.TooltipStatus=null;
-                this.HideMinuteChartTooltip();
-                this.HideFloatTooltip();
+                this.HideAllTooltip();
                 if (this.GotoNextPage(this.PageUpDownCycle)) 
                 {
                     this.Draw();
@@ -1800,8 +1847,7 @@ function JSReportChartContainer(uielement)
             else if (wheelValue>0)  //上一页
             {
                 this.LastMouseStatus.TooltipStatus=null;
-                this.HideMinuteChartTooltip();
-                this.HideFloatTooltip();
+                this.HideAllTooltip();
                 if (this.GotoPreviousPage(this.PageUpDownCycle)) 
                 {
                     this.Draw();
@@ -1823,8 +1869,7 @@ function JSReportChartContainer(uielement)
         var keyID = e.keyCode ? e.keyCode :e.which;
         if (keyID==116) return; //F15刷新不处理
 
-        this.HideMinuteChartTooltip();
-        this.HideFloatTooltip();
+        this.HideAllTooltip();
         switch(keyID)
         {
             case 33:    //page up
@@ -2113,7 +2158,8 @@ function JSReportChartContainer(uielement)
         if (this.LastMouseStatus.TooltipStatus) bDrawTooltip=true;
         this.LastMouseStatus.TooltipStatus=null;
 
-        var bShowChartTooltip=false;
+        var bShowKLineTooltip=false;
+        var bShowMinuteTooltip=false;
         var chartTooltipData=null;
         
         if (this.DragRow) return;
@@ -2189,7 +2235,15 @@ function JSReportChartContainer(uielement)
                     {
                         if (tooltipData.Stock && tooltipData.Stock.Symbol)
                         {
-                            bShowChartTooltip=true;
+                            bShowMinuteTooltip=true;
+                            chartTooltipData={ Symbol:tooltipData.Stock.OriginalSymbol, Rect:tooltipData.Rect };
+                        }
+                    }
+                    else if (tooltipData.Type==21)
+                    {
+                        if (tooltipData.Stock && tooltipData.Stock.Symbol)
+                        {
+                            bShowKLineTooltip=true;
                             chartTooltipData={ Symbol:tooltipData.Stock.OriginalSymbol, Rect:tooltipData.Rect };
                         }
                     }
@@ -2239,20 +2293,17 @@ function JSReportChartContainer(uielement)
             this.HideFloatTooltip();
         }
 
-        if (bShowChartTooltip)
-        {
-            this.ShowMinuteChartTooltip(null, null, chartTooltipData);
-        }
-        else
-        {
-            this.HideMinuteChartTooltip();
-        }
+        if (!bShowKLineTooltip) this.HideKLineChartTooltip();
+        if (!bShowMinuteTooltip) this.HideMinuteChartTooltip();
+
+        if (bShowMinuteTooltip) this.ShowMinuteChartTooltip(null, null, chartTooltipData);
+        if (bShowKLineTooltip) this.ShowKLineChartTooltip(null, null, chartTooltipData);
+
     }
 
     this.UIOnMounseOut=function(e)
     {
-        this.HideMinuteChartTooltip();
-        this.HideFloatTooltip();
+        this.HideAllTooltip();
         
         var bDraw=false;
         var tabChart=this.GetTabChart();
@@ -2278,8 +2329,7 @@ function JSReportChartContainer(uielement)
 
     this.UIOnMouseleave=function(e)
     {
-        this.HideMinuteChartTooltip();
-        this.HideFloatTooltip();
+        this.HideAllTooltip();
 
         var tabChart=this.GetTabChart();
         if (tabChart && tabChart.MoveOnTabIndex>=0)
@@ -2505,7 +2555,7 @@ function JSReportChartContainer(uielement)
         document.onmouseup=null;
 
         this.StopAutoDragScrollTimer();
-        this.HideTooltip();
+        this.HideAllTooltip();
         var reportChart=this.GetReportChart();
 
         var mouseStatus={ Cursor:"default", Name:"Default"};;   //鼠标状态
@@ -4897,7 +4947,8 @@ function ChartReport()
         if (IFrameSplitOperator.IsNumber(item.FloatPrecision)) colItem.FloatPrecision=item.FloatPrecision;    //小数位数
         if (IFrameSplitOperator.IsNumber(item.ColorType))  colItem.ColorType=item.ColorType;        //0=默认 1=(>0, =0, <0) 2=(>=0, <0)
         if (item.Icon) colItem.Icon=item.Icon;
-        if (IFrameSplitOperator.IsBool(item.EnableChartTooltip)) colItem.EnableChartTooltip=item.EnableChartTooltip;
+        if (IFrameSplitOperator.IsBool(item.EnableChartTooltip)) colItem.ChartTooltip={ Enable:item.EnableChartTooltip, Type:20 };
+        if (item.ChartTooltip) colItem.ChartTooltip={ Enable:item.ChartTooltip.Enable, Type:item.ChartTooltip.Type };
 
         //点击表头弹出菜单
         if (IFrameSplitOperator.IsBool(item.EnablePopupHeaderMenu)) colItem.EnablePopupHeaderMenu=item.EnablePopupHeaderMenu;
@@ -6466,9 +6517,9 @@ function ChartReport()
             var tooltipData={ Rect:rtItem, Stock:stock, Index:index, Column:column, RowType:rowType, Type:drawInfo.Tooltip.Type, Data:drawInfo.Tooltip.Data };
             this.TooltipRect.push(tooltipData);
         }
-        else if (column.EnableChartTooltip)
+        else if (column.ChartTooltip && column.ChartTooltip.Enable && IFrameSplitOperator.IsNumber(column.ChartTooltip.Type))   //Type 20分时图 21K线图
         {
-            var tooltipData={ Rect:rtItem, Stock:stock, Index:index, Column:column, RowType:rowType, Type:20 };
+            var tooltipData={ Rect:rtItem, Stock:stock, Index:index, Column:column, RowType:rowType, Type:column.ChartTooltip.Type };
             this.TooltipRect.push(tooltipData);
         }
 

package/src/jscommon/umychart.resource/css/tools.css

@@ -1566,6 +1566,8 @@ input[type="color"] {
     border: solid 1px rgba(200, 210, 219, 0.92);
     z-index: 99;
     pointer-events:none;
+    left: 0px;
+    top: 0px;
 }
 
 .UMyChart_Tooltip_Minute_Chart_Div
@@ -1575,6 +1577,39 @@ input[type="color"] {
 }
 
 
+/*
+    Copyright (c) 2018 jones
+ 
+    http://www.apache.org/licenses/LICENSE-2.0
+
+   开源项目 https://github.com/jones2000/HQChart
+ 
+   jones_2000@163.com
+
+   内置K线图图浮动框
+*/
+
+.UMyChart_Tooltip_KLine_Div
+{
+    position: absolute;
+    height: 300px;
+    width: 400px;
+    visibility:hidden;
+    background-color: rgba(255,255,255,0.95);
+    border: solid 1px rgba(200, 210, 219, 0.92);
+    z-index: 99;
+    pointer-events:none;
+    left: 0px;
+    top: 0px;
+}
+
+.UMyChart_Tooltip_KLine_Chart_Div
+{
+    height: 100%;
+    width: 100%;
+}
+
+
 /*
     Copyright (c) 2018 jones
  

package/src/jscommon/umychart.resource/font/drawtool/demo_index.html

@@ -54,6 +54,30 @@
       <div class="content unicode" style="display: block;">
           <ul class="icon_lists dib-box">
           
+            <li class="dib">
+              <span class="icon hqchart_drawtool">&#xe79e;</span>
+                <div class="name">图标_固定范围成交量分布图</div>
+                <div class="code-name">&amp;#xe79e;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon hqchart_drawtool">&#xe897;</span>
+                <div class="name">zoom out</div>
+                <div class="code-name">&amp;#xe897;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon hqchart_drawtool">&#xe898;</span>
+                <div class="name">zoom in</div>
+                <div class="code-name">&amp;#xe898;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon hqchart_drawtool">&#xe651;</span>
+                <div class="name">编辑</div>
+                <div class="code-name">&amp;#xe651;</div>
+              </li>
+          
             <li class="dib">
               <span class="icon hqchart_drawtool">&#xe7fa;</span>
                 <div class="name">unlock</div>
@@ -480,9 +504,9 @@
 <pre><code class="language-css"
 >@font-face {
   font-family: 'hqchart_drawtool';
-  src: url('iconfont.woff2?t=1724304295473') format('woff2'),
-       url('iconfont.woff?t=1724304295473') format('woff'),
-       url('iconfont.ttf?t=1724304295473') format('truetype');
+  src: url('iconfont.woff2?t=1741778896955') format('woff2'),
+       url('iconfont.woff?t=1741778896955') format('woff'),
+       url('iconfont.ttf?t=1741778896955') format('truetype');
 }
 </code></pre>
           <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
@@ -508,6 +532,42 @@
       <div class="content font-class">
         <ul class="icon_lists dib-box">
           
+          <li class="dib">
+            <span class="icon hqchart_drawtool icon-tubiao_gudingfanweichengjiaoliangfenbutu"></span>
+            <div class="name">
+              图标_固定范围成交量分布图
+            </div>
+            <div class="code-name">.icon-tubiao_gudingfanweichengjiaoliangfenbutu
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon hqchart_drawtool icon-zoomout"></span>
+            <div class="name">
+              zoom out
+            </div>
+            <div class="code-name">.icon-zoomout
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon hqchart_drawtool icon-zoomin"></span>
+            <div class="name">
+              zoom in
+            </div>
+            <div class="code-name">.icon-zoomin
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon hqchart_drawtool icon-bianji"></span>
+            <div class="name">
+              编辑
+            </div>
+            <div class="code-name">.icon-bianji
+            </div>
+          </li>
+          
           <li class="dib">
             <span class="icon hqchart_drawtool icon-unlock"></span>
             <div class="name">
@@ -1147,6 +1207,38 @@
       <div class="content symbol">
           <ul class="icon_lists dib-box">
           
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-tubiao_gudingfanweichengjiaoliangfenbutu"></use>
+                </svg>
+                <div class="name">图标_固定范围成交量分布图</div>
+                <div class="code-name">#icon-tubiao_gudingfanweichengjiaoliangfenbutu</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-zoomout"></use>
+                </svg>
+                <div class="name">zoom out</div>
+                <div class="code-name">#icon-zoomout</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-zoomin"></use>
+                </svg>
+                <div class="name">zoom in</div>
+                <div class="code-name">#icon-zoomin</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-bianji"></use>
+                </svg>
+                <div class="name">编辑</div>
+                <div class="code-name">#icon-bianji</div>
+            </li>
+          
             <li class="dib">
                 <svg class="icon svg-icon" aria-hidden="true">
                   <use xlink:href="#icon-unlock"></use>

package/src/jscommon/umychart.resource/font/drawtool/iconfont.css

@@ -1,8 +1,8 @@
 @font-face {
   font-family: "hqchart_drawtool"; /* Project id 4529603 */
-  src: url('iconfont.woff2?t=1724304295473') format('woff2'),
-       url('iconfont.woff?t=1724304295473') format('woff'),
-       url('iconfont.ttf?t=1724304295473') format('truetype');
+  src: url('iconfont.woff2?t=1741778896955') format('woff2'),
+       url('iconfont.woff?t=1741778896955') format('woff'),
+       url('iconfont.ttf?t=1741778896955') format('truetype');
 }
 
 .hqchart_drawtool {
@@ -13,6 +13,22 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.icon-tubiao_gudingfanweichengjiaoliangfenbutu:before {
+  content: "\e79e";
+}
+
+.icon-zoomout:before {
+  content: "\e897";
+}
+
+.icon-zoomin:before {
+  content: "\e898";
+}
+
+.icon-bianji:before {
+  content: "\e651";
+}
+
 .icon-unlock:before {
   content: "\e7fa";
 }