Highstocks - 显示悬停在某一点上的年份

时间:2018-03-28 08:30:10

标签: javascript highstock

在highstocks演示中 - https://www.highcharts.com/stock/demo/basic-line - 您可以看到何时悬停在工具提示出现在底部的日期,月份和年份。

Highstock Hover Over

然而,在我的演示中 - http://jsfiddle.net/czsLpfp0/2/ - 您可以看到未显示年份。

enter image description here

任何人都可以解释我如何在这个'工具提示中显示年份?

// Create the chart
Highcharts.stockChart('container', {
  "foo": 2,
  "chart": {
    "zoomType": "x"
  },
  "exporting": {
    "enabled": false
  },
  "rangeSelector": {
    "enabled": true
  },
  "navigator": {
    "enabled": true
  },
  "size": {
    "height": "400"
  },
  "series": [{
    "name": "publishedDate._date_dt",
    "data": [
      [746866800000, 1],
      [788947200000, 2],
      [791625600000, 1],
      [796723200000, 1],
      [801990000000, 1],
      [807260400000, 1],
      [817804800000, 1],
      [820483200000, 1],
      [830242800000, 1],
      [833612400000, 5],
      [836204400000, 1],
      [844153200000, 1],
      [852105600000, 2],
      [854784000000, 1],
      [857203200000, 2],
      [865148400000, 1],
      [867740400000, 1],
      [870418800000, 1],
      [873097200000, 2],
      [875689200000, 1],
      [878371200000, 1],
      [880963200000, 1],
      [883641600000, 2],
      [888739200000, 1],
      [894006000000, 3],
      [896684400000, 3],
      [899276400000, 1],
      [904633200000, 1],
      [909907200000, 1],
      [925542000000, 2],
      [928220400000, 1],
      [933490800000, 2],
      [934182000000, 1],
      [936169200000, 1],
      [938761200000, 3],
      [941443200000, 1],
      [944035200000, 3],
      [946713600000, 1],
      [958374000000, 1],
      [959842800000, 1],
      [962434800000, 2],
      [965113200000, 3],
      [975657600000, 2],
      [978336000000, 1],
      [988700400000, 2],
      [1001919600000, 1],
      [1004601600000, 1],
      [1014969600000, 7],
      [1017648000000, 1],
      [1020236400000, 1],
      [1025506800000, 3],
      [1028185200000, 3],
      [1030863600000, 1],
      [1033455600000, 2],
      [1036137600000, 2],
      [1038729600000, 3],
      [1041408000000, 2],
      [1044086400000, 1],
      [1051772400000, 3],
      [1057042800000, 2],
      [1062399600000, 2],
      [1067673600000, 2],
      [1078128000000, 2],
      [1091343600000, 2],
      [1096614000000, 2],
      [1099296000000, 3],
      [1101888000000, 2],
      [1109664000000, 15],
      [1128150000000, 2],
      [1141200000000, 3],
      [1162368000000, 3],
      [1167638400000, 2],
      [1175410800000, 3],
      [1180681200000, 2],
      [1183273200000, 2],
      [1188630000000, 2],
      [1199174400000, 4],
      [1207033200000, 2],
      [1217574000000, 2],
      [1228118400000, 4],
      [1235894400000, 3],
      [1238569200000, 2],
      [1241161200000, 4],
      [1249110000000, 3],
      [1251788400000, 2],
      [1254380400000, 2],
      [1257058800000, 3],
      [1262332800000, 2],
      [1275375600000, 2],
      [1290412800000, 2],
      [1291190400000, 2],
      [1305442800000, 2],
      [1316502000000, 2],
      [1321344000000, 2],
      [1323676800000, 2],
      [1329120000000, 2],
      [1356940800000, 3],
      [1370242800000, 2],
      [1379574000000, 3],
      [1388476800000, 3]
    ],
    "type": "spline",
    "showInNavigator": true,
    "selected": true,
    "id": "cc-1",
    "_colorIndex": 0,
    "_symbolIndex": 0
  }],
  "xAxis": {
    "title": {},
    "events": {}
  },
  "credits": {
    "enabled": false
  },
  "yAxis": {
    "title": {}
  },
  "title": {},
  "subtitle": {},
  "loading": false,
  "chartType": "stock"
});

1 个答案:

答案 0 :(得分:2)

您可以在图表的主要选项中指定tooltip.xDateFormat

tooltip: {    
    xDateFormat: '%A, %b %d,%Y'
}



// Create the chart
Highcharts.stockChart('container', {
  "foo": 2,
  "chart": {
    "zoomType": "x"
  },
  "exporting": {
    "enabled": false
  },
  "rangeSelector": {
    "enabled": true
  },
  "navigator": {
    "enabled": true
  },
  "size": {
    "height": "400"
  },
  "series": [{
    "name": "publishedDate._date_dt",
    "data": [
      [746866800000, 1],
      [788947200000, 2],
      [791625600000, 1],
      [796723200000, 1],
      [801990000000, 1],
      [807260400000, 1],
      [817804800000, 1],
      [820483200000, 1],
      [830242800000, 1],
      [833612400000, 5],
      [836204400000, 1],
      [844153200000, 1],
      [852105600000, 2],
      [854784000000, 1],
      [857203200000, 2],
      [865148400000, 1],
      [867740400000, 1],
      [870418800000, 1],
      [873097200000, 2],
      [875689200000, 1],
      [878371200000, 1],
      [880963200000, 1],
      [883641600000, 2],
      [888739200000, 1],
      [894006000000, 3],
      [896684400000, 3],
      [899276400000, 1],
      [904633200000, 1],
      [909907200000, 1],
      [925542000000, 2],
      [928220400000, 1],
      [933490800000, 2],
      [934182000000, 1],
      [936169200000, 1],
      [938761200000, 3],
      [941443200000, 1],
      [944035200000, 3],
      [946713600000, 1],
      [958374000000, 1],
      [959842800000, 1],
      [962434800000, 2],
      [965113200000, 3],
      [975657600000, 2],
      [978336000000, 1],
      [988700400000, 2],
      [1001919600000, 1],
      [1004601600000, 1],
      [1014969600000, 7],
      [1017648000000, 1],
      [1020236400000, 1],
      [1025506800000, 3],
      [1028185200000, 3],
      [1030863600000, 1],
      [1033455600000, 2],
      [1036137600000, 2],
      [1038729600000, 3],
      [1041408000000, 2],
      [1044086400000, 1],
      [1051772400000, 3],
      [1057042800000, 2],
      [1062399600000, 2],
      [1067673600000, 2],
      [1078128000000, 2],
      [1091343600000, 2],
      [1096614000000, 2],
      [1099296000000, 3],
      [1101888000000, 2],
      [1109664000000, 15],
      [1128150000000, 2],
      [1141200000000, 3],
      [1162368000000, 3],
      [1167638400000, 2],
      [1175410800000, 3],
      [1180681200000, 2],
      [1183273200000, 2],
      [1188630000000, 2],
      [1199174400000, 4],
      [1207033200000, 2],
      [1217574000000, 2],
      [1228118400000, 4],
      [1235894400000, 3],
      [1238569200000, 2],
      [1241161200000, 4],
      [1249110000000, 3],
      [1251788400000, 2],
      [1254380400000, 2],
      [1257058800000, 3],
      [1262332800000, 2],
      [1275375600000, 2],
      [1290412800000, 2],
      [1291190400000, 2],
      [1305442800000, 2],
      [1316502000000, 2],
      [1321344000000, 2],
      [1323676800000, 2],
      [1329120000000, 2],
      [1356940800000, 3],
      [1370242800000, 2],
      [1379574000000, 3],
      [1388476800000, 3]
    ],
    "type": "spline",
    "showInNavigator": true,
    "selected": true,
    "id": "cc-1",
    "_colorIndex": 0,
    "_symbolIndex": 0,
  }],
  "xAxis": {
    "title": {},
    "events": {}
  },
  "credits": {
    "enabled": false
  },
  "yAxis": {
    "title": {}
  },
  "title": {},
  "subtitle": {},
  "loading": false,
  "chartType": "stock",
	tooltip: {    
    xDateFormat: '%A, %b %d, %Y'
	}
});

<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="https://code.highcharts.com/stock/highstock.js"></script>
<script src="https://code.highcharts.com/stock/modules/exporting.js"></script>

<div id="container" style="height: 400px; min-width: 310px"></div>
&#13;
&#13;
&#13;

browser