Is there any example of linecap in highcharts. http://api.highcharts.com/highstock#plotOptions.line.linecap
I want to change it from round to butt. but it's not working.
As I see you can use square and effect should be the same
plotOptions:{
line:{
linecap: 'square',
lineWidth:10,
marker:{
enabled:false
}
}
},
http://jsfiddle.net/9XSxD/
Related
I have a Gantt Chart with a Navigator bar at the bottom that look like this:
The image as you can see is hard to read because of the color of the milestones... my question is, how do we get a white border on each of these milestones... I tried on almost everything the docs say, on series, datalabels, etc and I can't make any border show, thank you for any help you may bring.
You just need to specify borderWidth and borderColor properties for the specific data points:
Highcharts.ganttChart('container', {
series: [{
...,
data: [
...,
{
...,
borderWidth: 2,
borderColor: 'black'
}]
}],
...
});
Live demo: https://jsfiddle.net/BlackLabel/xps2d6z3/
API Reference:
https://api.highcharts.com/gantt/series.gantt.borderWidth
https://api.highcharts.com/gantt/series.gantt.borderColor
I'm trying to change the size of a column in a heatmap. I can use the colsize to set the width of the border, but i'd like to change the width of the entire column. Is this possible?
Here's a JS fiddle example.
http://jsfiddle.net/8b9410om/
The Total column I would like to change to the same size at the border that you can see around it
You can use endOnTick and pointPlacement properties:
xAxis: {
...,
max: 1.25,
endOnTick: false
},
series: [...,
{
colsize: 0.25,
pointPlacement: -1.5,
...
}
]
Live demo: http://jsfiddle.net/BlackLabel/t3r12hnk/
API Reference:
https://api.highcharts.com/highcharts/series.heatmap.pointPlacement
https://api.highcharts.com/highcharts/xAxis.max
When I set this:
series: {
fillOpacity: 0.5,
fillColor:'#fff000'
}
highcharts will ignore opacity, if I take away fillcolor, the opacity works. However, I was asked to set fillcolour to be different.
http://jsfiddle.net/ywL646r8/1/. Can someone help?
Many Thanks
You can set the fill color with a rgba value
plotOptions: {
area: {
color: '#ff0000',
},
series: {
fillColor:'rgba(255,240,0,.5)'
}
http://jsfiddle.net/ywL646r8/2/
I wanted to have the tick labels inside the chart and I found the API for it but I can't get it to work.
Here is the fiddle
Is there anything I am missing here?
You should set negative y parameter:
http://jsfiddle.net/aFsAb/
xAxis: {
tickPosition: 'inside',
labels:{
y:-10
}
},
Is there a way to influence the transparency of the bubbles in Highcharts bubble charts?
I was looking for a configuration comparable to area fillColor, but didn't find one.
I tried using rgba colors for the series, like so:
series: [{
color: "rgba(255,0,0,0.5)",
data: [
but that only made the border semi transparent.
Edit:
I just tried to use marker fillColor:
series: [{
color: "rgba(255,0,0,1)",
marker: {
fillColor: "rgba(255,0,0,0.1)"
},
but that doesn't influence the transparency
You can use fillOpacity parameter,
marker: {
fillOpacity:0.3
}
http://jsfiddle.net/g8JcL/116/
The easiest way would be adding a CSS property.
.highcharts-point {
fill-opacity: 0.8;
}
But this will be applied to all the bubbles.