Merge pull request #114 from ElemeFE/1207-add-k

新增：k 线图
ElemeFE · Dec 21, 2017 · cc8a139 · cc8a139
2 parents 7f10c30 + dbdd109
commit cc8a139
Show file tree

Hide file tree

Showing 16 changed files with 1,162 additions and 8 deletions.
diff --git a/docs/candle.md b/docs/candle.md
diff --git a/docs/scatter.md b/docs/scatter.md
@@ -448,7 +448,7 @@ visualMap 中的 dimension 属性用于设置数据的哪个指标映射到视
 | axisVisible | 是否显示坐标轴 | Boolean | - |
 | symbolSizeMax | 气泡最大值 | Number | 默认为50 |
 | symbol | 标记的图形 | String | 内容参考[文档](http://echarts.baidu.com/option.html#series-scatter.symbol) |
-| symbolSize | 标记的大小 | number, Array, Function | 内容参考[文档](number, Array, Function) |
+| symbolSize | 标记的大小 | number, Array, Function | 内容参考[文档](http://echarts.baidu.com/option.html#series-scatter.symbolSize) |
 | symbolRotate | 标记的旋转角度 | number | 内容参考[文档](http://echarts.baidu.com/option.html#series-scatter.symbolRotate) |
 | symbolOffset | 标记相对于原本位置的偏移 | Array | 内容参考[文档](http://echarts.baidu.com/option.html#series-scatter.symbolOffset) |
 | cursor | 鼠标悬浮时在图形元素上时鼠标的样式 | string | 内容参考[文档](http://echarts.baidu.com/option.html#series-scatter.cursor) |

diff --git a/docs/sidebar.md b/docs/sidebar.md
@@ -15,6 +15,7 @@
   - [桑基图](/sankey)
   - [热力图](/heatmap)
   - [散点图](/scatter)
+  - [K线图](/candle)
 - 其他
   - [事件监听](/event)
   - [图表切换](/toggle)

diff --git a/examples/data/candle.js b/examples/data/candle.js
@@ -0,0 +1,157 @@
+const data = {
+  columns: ['日期', 'open', 'close', 'lowest', 'highest', 'vol'],
+  rows: [
+    { '日期': '2004-01-05', open: 10411.85, close: 10544.07, lowest: 10411.85, highest: 10575.92, vol: 221290000 },
+    { '日期': '2004-01-06', open: 10543.85, close: 10538.66, lowest: 10454.37, highest: 10584.07, vol: 191460000 },
+    { '日期': '2004-01-07', open: 10535.46, close: 10529.03, lowest: 10432.12, highest: 10587.55, vol: 225490000 },
+    { '日期': '2004-01-08', open: 10530.07, close: 10592.44, lowest: 10480.59, highest: 10651.99, vol: 237770000 },
+    { '日期': '2004-01-09', open: 10589.25, close: 10458.89, lowest: 10420.52, highest: 10603.48, vol: 223250000 },
+    { '日期': '2004-01-12', open: 10461.55, close: 10485.18, lowest: 10389.85, highest: 10543.03, vol: 197960000 },
+    { '日期': '2004-01-13', open: 10485.18, close: 10427.18, lowest: 10341.19, highest: 10539.25, vol: 197310000 },
+    { '日期': '2004-01-14', open: 10428.67, close: 10538.37, lowest: 10426.89, highest: 10573.85, vol: 186280000 },
+    { '日期': '2004-01-15', open: 10534.52, close: 10553.85, lowest: 10454.52, highest: 10639.03, vol: 260090000 },
+    { '日期': '2004-01-16', open: 10556.37, close: 10600.51, lowest: 10503.71, highest: 10666.88, vol: 254170000 },
+    { '日期': '2004-01-20', open: 10601.42, close: 10528.66, lowest: 10447.92, highest: 10676.96, vol: 224300000 },
+    { '日期': '2004-01-21', open: 10522.77, close: 10623.62, lowest: 10453.11, highest: 10665.72, vol: 214920000 },
+    { '日期': '2004-01-22', open: 10624.22, close: 10623.18, lowest: 10545.03, highest: 10717.41, vol: 219720000 },
+    { '日期': '2004-01-23', open: 10625.25, close: 10568.29, lowest: 10490.14, highest: 10691.77, vol: 234260000 },
+    { '日期': '2004-01-26', open: 10568.12, close: 10702.51, lowest: 10510.44, highest: 10725.18, vol: 186170000 },
+    { '日期': '2004-01-27', open: 10701.11, close: 10609.92, lowest: 10579.33, highest: 10748.81, vol: 206560000 },
+    { '日期': '2004-01-28', open: 10610.07, close: 10468.37, lowest: 10412.44, highest: 10703.25, vol: 247660000 },
+    { '日期': '2004-01-29', open: 10467.41, close: 10510.29, lowest: 10369.92, highest: 10611.56, vol: 273970000 },
+    { '日期': '2004-01-30', open: 10510.22, close: 10488.07, lowest: 10385.56, highest: 10551.03, vol: 208990000 },
+    { '日期': '2004-02-02', open: 10487.78, close: 10499.18, lowest: 10395.55, highest: 10614.44, vol: 224800000 },
+    { '日期': '2004-02-03', open: 10499.48, close: 10505.18, lowest: 10414.15, highest: 10571.48, vol: 183810000 },
+    { '日期': '2004-02-04', open: 10503.11, close: 10470.74, lowest: 10394.81, highest: 10567.85, vol: 227760000 },
+    { '日期': '2004-02-05', open: 10469.33, close: 10495.55, lowest: 10399.92, highest: 10566.37, vol: 187810000 },
+    { '日期': '2004-02-06', open: 10494.89, close: 10593.03, lowest: 10433.74, highest: 10634.81, vol: 182880000 },
+    { '日期': '2004-02-09', open: 10592.41, close: 10579.03, lowest: 10433.72, highest: 10634.81, vol: 160720000 },
+    { '日期': '2004-02-10', open: 10578.74, close: 10613.85, lowest: 10511.18, highest: 10667.03, vol: 160590000 },
+    { '日期': '2004-02-11', open: 10605.48, close: 10737.72, lowest: 10561.55, highest: 10779.41, vol: 277850000 },
+    { '日期': '2004-02-12', open: 10735.18, close: 10694.07, lowest: 10636.44, highest: 10775.03, vol: 197560000 },
+    { '日期': '2004-02-13', open: 10696.22, close: 10627.85, lowest: 10578.66, highest: 10755.47, vol: 208340000 },
+    { '日期': '2004-02-17', open: 10628.88, close: 10714.88, lowest: 10628.88, highest: 10762.07, vol: 169730000 },
+    { '日期': '2004-02-18', open: 10706.68, close: 10671.99, lowest: 10623.62, highest: 10764.36, vol: 164370000 },
+    { '日期': '2004-02-19', open: 10674.59, close: 10664.73, lowest: 10626.44, highest: 10794.95, vol: 219890000 },
+    { '日期': '2004-02-20', open: 10666.29, close: 10619.03, lowest: 10559.11, highest: 10722.77, vol: 220560000 },
+    { '日期': '2004-02-23', open: 10619.55, close: 10609.62, lowest: 10508.89, highest: 10711.84, vol: 229950000 },
+    { '日期': '2004-02-24', open: 10609.55, close: 10566.37, lowest: 10479.33, highest: 10681.41, vol: 225670000 },
+    { '日期': '2004-02-25', open: 10566.59, close: 10601.62, lowest: 10509.42, highest: 10660.73, vol: 192420000 },
+    { '日期': '2004-02-26', open: 10598.14, close: 10580.14, lowest: 10493.71, highest: 10652.96, vol: 223230000 },
+    { '日期': '2004-02-27', open: 10581.55, close: 10583.92, lowest: 10519.03, highest: 10689.55, vol: 200050000 }
+  ]
+}
+
+const dataLite = {
+  columns: ['日期', 'open', 'close', 'lowest', 'highest', 'vol'],
+  rows: [
+    ['2004-01-05', 10411.85, 10544.07, 10411.85, 10575.92, 221290000],
+    ['2004-01-06', 10543.85, 10538.66, 10454.37, 10584.07, 191460000],
+    ['2004-01-07', 10535.46, 10529.03, 10432, 10587.55, 225490000],
+    ['2004-01-08', 10530.07, 10592.44, 10480.59, 10651.99, 237770000],
+    ['2004-01-09', 10589.25, 10458.89, 10420.52, 10603.48, 223250000],
+    ['2004-01-12', 10461.55, 10485.18, 10389.85, 10543.03, 197960000],
+    ['2004-01-13', 10485.18, 10427.18, 10341.19, 10539.25, 197310000],
+    ['2004-01-14', 10428.67, 10538.37, 10426.89, 10573.85, 186280000],
+    ['2004-01-15', 10534.52, 10553.85, 10454.52, 10639.03, 260090000],
+    ['2004-01-16', 10556.37, 10600.51, 10503.7, 10666.88, 254170000],
+    ['2004-01-20', 10601.4, 10528.66, 10447.92, 10676.96, 224300000],
+    ['2004-01-21', 10522.77, 10623.62, 10453.11, 10665.7, 214920000],
+    ['2004-01-22', 10624.22, 10623.18, 10545.03, 10717.4, 219720000],
+    ['2004-01-23', 10625.25, 10568.29, 10490.14, 10691.77, 234260000],
+    ['2004-01-26', 10568, 10702.51, 10510.44, 10725.18, 186170000],
+    ['2004-01-27', 10701.1, 10609.92, 10579.33, 10748.81, 206560000],
+    ['2004-01-28', 10610.07, 10468.37, 10412.44, 10703.25, 247660000],
+    ['2004-01-29', 10467.41, 10510.29, 10369.92, 10611.56, 273970000],
+    ['2004-01-30', 10510.22, 10488.07, 10385.56, 10551.03, 208990000],
+    ['2004-02-02', 10487.78, 10499.18, 10395.55, 10614.44, 224800000],
+    ['2004-02-03', 10499.48, 10505.18, 10414.15, 10571.48, 183810000],
+    ['2004-02-04', 10503.11, 10470.74, 10394.81, 10567.85, 227760000],
+    ['2004-02-05', 10469.33, 10495.55, 10399.92, 10566.37, 187810000],
+    ['2004-02-06', 10494.89, 10593.03, 10433.7, 10634.81, 182880000],
+    ['2004-02-09', 10592, 10579.03, 10433.7, 10634.81, 160720000],
+    ['2004-02-10', 10578.74, 10613.85, 10511.18, 10667.03, 160590000],
+    ['2004-02-11', 10605.48, 10737.7, 10561.55, 10779.4, 277850000],
+    ['2004-02-12', 10735.18, 10694.07, 10636.44, 10775.03, 197560000],
+    ['2004-02-13', 10696.22, 10627.85, 10578.66, 10755.47, 208340000],
+    ['2004-02-17', 10628.88, 10714.88, 10628.88, 10762.07, 169730000],
+    ['2004-02-18', 10706.68, 10671.99, 10623.62, 10764.36, 164370000],
+    ['2004-02-19', 10674.59, 10664.73, 10626.44, 10794.95, 219890000],
+    ['2004-02-20', 10666.29, 10619.03, 10559.11, 10722.77, 220560000],
+    ['2004-02-23', 10619.55, 10609.62, 10508.89, 10711.84, 229950000],
+    ['2004-02-24', 10609.55, 10566.37, 10479.33, 10681.4, 225670000],
+    ['2004-02-25', 10566.59, 10601.62, 10509.4, 10660.73, 192420000],
+    ['2004-02-26', 10598.14, 10580.14, 10493.7, 10652.96, 223230000],
+    ['2004-02-27', 10581.55, 10583.92, 10519.03, 10689.55, 200050000]
+  ]
+}
+export default {
+  name: 'K线图',
+  type: 'candle',
+  data: [
+    {
+      name: '简单K线图',
+      data,
+      settings: {}
+    },
+    {
+      name: '简化数据K线图',
+      data: dataLite,
+      settings: {}
+    },
+    {
+      name: '设置数据格式',
+      data,
+      settings: {
+        dataType: 'KMB'
+      }
+    },
+    {
+      name: '显示MA, VOL',
+      data,
+      settings: {
+        showMA: true,
+        showVOL: true
+      }
+    },
+    {
+      name: '修改指标名和图例文字',
+      data,
+      settings: {
+        showMA: true,
+        showVOL: true,
+        labelMap: {
+          MA5: 'ma5'
+        },
+        legendName: {
+          '日K': 'day k'
+        }
+      }
+    },
+    {
+      name: '修改 MA 列表',
+      data,
+      settings: {
+        showMA: true,
+        MA: [1, 2, 3, 4]
+      }
+    },
+    {
+      name: '显示 dataRoom',
+      data,
+      settings: {
+        showDataZoom: true,
+        start: 20,
+        end: 100
+      }
+    },
+    {
+      name: '设置上升下降颜色',
+      data,
+      settings: {
+        upColor: 'blue',
+        downColor: 'yellow'
+      }
+    }
+  ]
+}
diff --git a/examples/data/index.js b/examples/data/index.js
@@ -11,6 +11,7 @@ import map from './map'
 import sankey from './sankey'
 import heatmap from './heatmap'
 import scatter from './scatter'
+import candle from './candle'
 
 export default {
   bar,
@@ -25,5 +26,6 @@ export default {
   map,
   sankey,
   heatmap,
-  scatter
+  scatter,
+  candle
 }
diff --git a/examples/pages/chart.vue b/examples/pages/chart.vue
@@ -37,6 +37,7 @@ import VeMap from '../../src/packages/map'
 import VeSankey from '../../src/packages/sankey'
 import VeHeatmap from '../../src/packages/heatmap'
 import VeScatter from '../../src/packages/scatter'
+import VeCandle from '../../src/packages/candle'
 import CHART_DATA from '../data'
 
 export default {
@@ -79,7 +80,8 @@ export default {
     VeMap,
     VeSankey,
     VeHeatmap,
-    VeScatter
+    VeScatter,
+    VeCandle
   }
 }
 </script>

diff --git a/src/component-list.js b/src/component-list.js
@@ -13,5 +13,6 @@ module.exports = {
   VeBmap: { src: 'src/packages/bmap/index.js', dist: 'lib/bmap' },
   VeSankey: { src: 'src/packages/sankey/index.js', dist: 'lib/sankey' },
   Veheatmap: { src: 'src/packages/heatmap/index.js', dist: 'lib/heatmap' },
-  VeScatter: { src: 'src/packages/scatter/index.js', dist: 'lib/scatter' }
+  VeScatter: { src: 'src/packages/scatter/index.js', dist: 'lib/scatter' },
+  VeCandle: { src: 'src/packages/candle/index.js', dist: 'lib/candle' }
 }
diff --git a/src/index.es.js b/src/index.es.js
@@ -12,6 +12,7 @@ import VeBmap from './packages/bmap'
 import VeSankey from './packages/sankey'
 import VeHeatmap from './packages/heatmap'
 import VeScatter from './packages/scatter'
+import VeCandle from './packages/candle'
 
 const components = [
   VeBar,
@@ -27,7 +28,8 @@ const components = [
   VeBmap,
   VeSankey,
   VeHeatmap,
-  VeScatter
+  VeScatter,
+  VeCandle
 ]
 
 function install (Vue, _) {
@@ -51,5 +53,6 @@ export {
   VeSankey,
   VeHeatmap,
   VeScatter,
+  VeCandle,
   install
 }
diff --git a/src/packages/candle/index.js b/src/packages/candle/index.js
@@ -0,0 +1,17 @@
+import echarts from '../../echarts-base'
+import 'echarts/lib/chart/bar'
+import 'echarts/lib/chart/line'
+import 'echarts/lib/chart/candlestick'
+import 'echarts/lib/component/visualMap'
+import 'echarts/lib/component/dataZoom'
+import { candle } from './main'
+import Core from '../../core'
+
+export default {
+  name: 'VeCandle',
+  mixins: [Core],
+  created () {
+    this.chartHandler = candle
+    this.echartsLib = echarts
+  }
+}