score:5
Accepted answer
the highcharts way of hiding labels on a per series basis is by using the series.line.label.enabled toggle. to hide labels for all series in a chart the following can be toggled (plotoptions.series.label.enabled):
plotoptions: {
series: {
label: {enabled: false},
...
}
}
similarly, to change the color of the label for a series the series.line.label.style can be used, or to change the color for all series in a chart (plotoptions.series.label.style):
plotoptions: {
series: {
label: {style: {color: 'black'}},
...
}
}
which leads to this example:
highcharts.chart('container', {
chart: {
type: 'line'
},
title: { text: 'no labels' },
plotoptions: {
series: {
label: {
enabled: false
}
}
},
series: [
{
name: 'unites states',
data: [7.5, 15.2, 18.7, 21.5, 25.9, 30.2, 29.0, 28.6, 27.2, 20.3, 18.6, 14.8]
},
{
name: 'tokyo',
data: [7.0, 6.9, 9.5, 14.5, 18.4, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]
}, {
name: 'london',
data: [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]
}]
});
highcharts.chart('container2', {
chart: {
type: 'line',
},
title: { text: 'black labels' },
plotoptions: {
series: {
label: {
style: {
color: 'black'
}
}
}
},
series: [
{
name: 'unites states',
data: [7.5, 15.2, 18.7, 21.5, 25.9, 30.2, 29.0, 28.6, 27.2, 20.3, 18.6, 14.8]
},
{
name: 'tokyo',
data: [7.0, 6.9, 9.5, 14.5, 18.4, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]
}, {
name: 'london',
data: [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]
}]
});
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/series-label.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<script src="https://code.highcharts.com/modules/export-data.js"></script>
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
<div id="container2" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
score:1
i think you want like this:-
highcharts.chart('container', {
chart: {
type: 'line'
},
series: [
{
name: 'unites states',
data: [7.5, 15.2, 18.7, 21.5, 25.9, 30.2, 29.0, 28.6, 27.2, 20.3, 18.6, 14.8],
},
{
name: 'tokyo',
data: [7.0, 6.9, 9.5, 14.5, 18.4, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6],
}, {
name: 'london',
data: [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8],
}]
});
.highcharts-label text {fill: rgb(0, 0, 0) !important;}
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/series-label.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<script src="https://code.highcharts.com/modules/export-data.js"></script>
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
Source: stackoverflow.com
Related Query
- How to set series-label to false by default and change the color of series label text in highchart
- How to change the series color and mark after I draw the line chart in highcharts?Does it has databound event?
- How to change the color of highcharts series graph to black & white during downloading it as an image?
- How can I set the legend symbol color for a series when using colorByPoint?
- Change the legend in highcharts heatmap to show instead of a color bar, a set of fixed icons with hide and show on click
- How to set the padding and placement if we have more than 16 data in the series
- How to change default color of a series chart in highcharts?
- Highcharts Highstock How do I change the label on top of tooltip for OHLC series data?
- How to make legend labels to bring out the series of a pie chart and not make them disappear when label is clicked in HighCharts?
- How to change the point color to red that is lowest point plotted in the graph and 2nd issue is animation effect is not supporting in the ie10,ie8
- How to change the label color of Y-Axis on click in angular Gantt chart High Chart
- How to Increase minimum point value and the color of series in advanced accessible charts in Highcharts by making it traverse
- How could I change the x,y label and remove empty x bar
- How to use the tooltip formatter and still display chart color (like it does by default)?
- Highstocks - How to change the default Zoom
- How to change the font family of Highchart to Bootstrap css default font family
- How to change the text color in Highcharts
- Highcharts - How to set custom colors for the series
- Can color of data label be different inside and outside of the bar in Highchart
- How to disable the on-hover color change in Highcharts?
- How to set dataLabel Format and axis label angle in R highcharter package
- How to change series legend text color in HighChart chart?
- How to change Highcharts xAxis label color individually?
- How do I set the background color of a Highcharts HTML label?
- How to use add series and update methods in the high chart wrapper for angular?
- Highcharts- how to set yAxis to the closest or exact value in the series data
- How do you set the stack order of the series in a stacked bar chart?
- Highcharts, how to change hover bg color for series with multiple columns (categories)
- How to color series legend in highcharts when colorbypoint is set to true
- In highcharts how do I change the color of the line above the categories?
More Query from same tag
- Combination of ohlc and line plot in highchart
- Is it possible to configure the size of top level in Sunburst chart similar to the innerSize in Pie chart?
- how to use javascript variable for complete series data
- Highcharts create custom button in config
- Show special symbol for each series in category in highcharts
- Is angular2-highcharts supported in Angular 11?
- Highstock - change range input beyond the data max
- HighCharts xAxis categories over 1000 data not work.
- Is there a way to get Highstock Scrollbar to respond to trackpad?
- Labels are not displayed on the chart
- User Editable Title in Highcharts
- Highcharts stacked drilldown with n-levels
- Passing string data as categories to Highcharts
- Highcharts: Stacked area tooltip showing wrong value
- HighCharts - Enable the markers for the series which has only single data point?
- Pie chart slice radius using HighCharts library
- How to make a Highcharts bar disappear?
- highcharts, possible bug setting tooltip formatter and html?
- Configuring Data Table from Highcharts Basic Column Chart
- JSON, Codeigniter, Highcharts and AJAX
- Set bubble transparency in Highcharts?
- Can you make an eeg chart with highchart?
- Highcharts Renderer Button ID
- How to display same data points in a same series in highcharts?
- How does HttpContext.Current.Response.Binarywrite work?
- Using custom fonts with Highcharts
- How to center title vertically in HighCharts pie/donut chart?
- HighChart xAxis Datetime value
- Highcharts: converting millimeters to pixel
- PHP array to Highcharts