Highcharts Stock Demo

author(s): Torstein Hønsi

by bluthcy

HTML

<div id="container" style="height: 400px; min-width: 600px"></div>

<script src="https://code.highcharts.com/stock/highstock.js"></script>

JavaScript

var lineData = [[0,null],[1451577600000,1203],[1451664000000,20000],[1454256000000,30000],[1456761600000,20000],[1459440000000,932310],[1459612800000,932311],[1459872000000,992311],[1462464000000,22311],[1465142400000,222311],[1467734400000,122311],[1470412800000,302311],[1473091200000,1000],[1514764800000,111111],[1546300800000,121111],[1577836800000,131111],[1609459200000,141111],[1640995200000,151111],[1672531200000,161111],[1704067200000,171111],[1735689600000,181111],[1767225600000,191111],[1893456000000,null]];
var formatTextData = [{"x":1451577600000,"title":"开户<br />2016-1-1","text":"开户<br />2016-1-1"},{"x":1451664000000,"title":"首次入金<br />2016-1-2","text":"首次入金<br />2016-1-2"},{"x":1454256000000,"title":"首次股基交易<br />2016-2-1","text":"首次股基交易<br />2016-2-1"},{"x":1456761600000,"title":"成为有效户<br />2016-3-1","text":"成为有效户<br />2016-3-1"},{"x":1459440000000,"title":"成为潜力有效户<br />2016-4-1","text":"成为潜力有效户<br />2016-4-1"},{"x":1459612800000,"title":"成为富裕客户<br />2016-4-3","text":"成为富裕客户<br />2016-4-3"},{"x":1459872000000,"title":"成为贵宾客户<br />2016-4-6","text":"成为贵宾客户<br />2016-4-6"},{"x":1462464000000,"title":"疑似流失<br />2016-5-6","text":"疑似流失<br />2016-5-6"},{"x":1465142400000,"title":"历史最大净资产<br />2016-6-6","text":"历史最大净资产<br />2016-6-6"},{"x":1467734400000,"title":"近一年最大净资产<br />2016-7-6","text":"近一年最大净资产<br />2016-7-6"},{"x":1470412800000,"title":"最近股基交易<br />2016-8-6","text":"最近股基交易<br />2016-8-6"},{"x":1473091200000,"title":"最近新股中签<br />2016-9-6","text":"最近新股中签<br />2016-9-6"}];
Highcharts.setOptions({
  global: {
    useUTC: false
  },
  lang: {
    weekdays:['星期日',  '星期一', '星期二', '星期三', '星期四', '星期五', '星期六']
  }
});
// 资产走势图配置
var chartOptions = {
  chart: {
    type: 'spline',
    spacing: [0, 15, 5, 15],
    width: lineData.length * 100,
    panning: false,
    resetZoomButton: {
      theme: {
        display: "none"
      }
    }
  },
  title: {
    enabled: !1
  },
  credits: {
    enabled: !1
  },
  legend: {
    enabled: !1
  },
  navigator: {
   ...