angular - Disable tooltip only for months and days in Highcharts -
hi highcharts community !
in angular 4 project, trying disable days , months in tooltip of horizontal bar chart, make appear hour minutes , secondes, if know how make it?
i tried property datetimelabelformats
without success
thanks in advance
horizontalbar.ts:
constructor(public userservice3: userservice3) { const timezoneoffset = new date().gettimezoneoffset(); const highcharts = require('highcharts'); highcharts.setoptions({ global: { timezoneoffset: timezoneoffset }, }); this.options = { title : { text : '' }, chart: { type: 'area', label: { format: '{data: %b}' }}, legend: { enabled: false }, credits: { enabled: false }, xaxis: { type: 'datetime', // day: '%h', startontick: false, endontick: false, mintickinterval: 24 * 3600 * 1000, tickinterval: 36e5 * 2, // 2 hours }, yaxis: { min: 0, max: 100, labels: { enabled: true }, title: { text: null }, }, plotoptions: { series: { color: '#648e59', fillopacity: 0.8, fillcolor: '#648e59', pointinterval: 36e5 * 2 // 2 hours } }, series: [{ name: 'taux de fonctionnement', data: [], }] }; } saveinstance(chartinstance) { this.chart = chartinstance; console.log(chartinstance); } public ngoninit () { this.datasubscription = this.userservice3.getdata().subscribe((data) => { this.options.series[0].data = data.data.operating_details; console.log(data); }); } ngondestroy() { if (this.datasubscription){ this.datasubscription.unsubscribe(); } } public hidedem2(): void { this.hidemeup = !this.hidemeup; this.hidemeup = !this.hidemeup; this.hideitup = !this.hideitup; if (this.hideitup) { this.opened.emit(true); } else { this.closed.emit(false); } console.log(this.hideitup); } }
horizontalbar.html:
<chart [options]="options" (load)="saveinstance($event.context)"> <!-- <point (select)="onpointselect($event)"></point> --> </chart>
if "tick in horizontal bar chart," mean axis labels, add following xaxis
options:
labels: { formatter: function () { return highcharts.dateformat('%h:%m:%s', this.value); }, },
that should return hours, minutes, , seconds of axis labels in format h:m:s
.
more information highcharts.dateformat()
can found here: http://api.highcharts.com/highcharts/highcharts.numberformat.
the highcharts.dateformat()
function uses php's strftime
formatting rules (see http://php.net/manual/en/function.strftime.php).
i hope information helpful you.
update: per emile's comments, tick in question chart's tooltip. in case, need modify follows:
tooltip: { formatter: function () { return highcharts.dateformat('%h:%m:%s', this.x); }, },
see following resources highcharts documentation:
Comments
Post a Comment