65

Highchart plotLines z Index between series z Index

 3 years ago
source link: https://www.codesd.com/item/highchart-plotlines-z-index-between-series-z-index.html
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

Highchart plotLines z Index between series z Index

advertisements

I am trying to create a fiddle, mocking up the image attached

o6JDX.png

in following jsfiddle

http://jsfiddle.net/2TuCW/162/

The problem is I want the plotLines between blue line and green column. I tried changing the zIndexes of plotLines (10) , between blue line (15) and green column (5) in following fiddle http://jsfiddle.net/2TuCW/163/

//plotLines zIndex
"plotLines" : [
        {
            "color": '#E5E7EB',
            "zIndex": 10,
            "width":    2,
            "value": 20 

        },

....
....
//Series data z-index
    "series": [{
        "type":"column",
        "data": [35,39,49,50,57,58],
        "zIndex":5
        ....
        ....
    "series": [{
        "type":"line",
        "data": [35,39,49,50,57,58],
        "zIndex":15

But it is not working as expected. Please suggest how to achieve it.


It is related with fact that all series have the same zIndex.

Related topic: https://github.com/highslide-software/highcharts.com/issues/3321

Related Articles

highcharts tooltip z-index

I'm trying to get the highcharts tooltip to have a zIndex using useHTML to position it over another HTML element. See this fiddle: http://jsfiddle.net/sDu8V/ I'd like the tooltip to go over the pink box - instead of under it. What am I missing?Possib

Javascript Highcharts rename or remove the series label in the chart

I have a Highchart column chart and at the bottom of the chart it says "Series 1" That has been labelled automatically so I need to either rename that or just remove it. Here is a screenshot showing exactly what I mean. data: [{ name: 'new name'

IE & lt; 9 + HighCharts does not make a series

Hello I have a problem with HighCharts under IE < 9. Internet explorer HighCharts screenshot HighCharts works fine in other browsers screenshot As you can see the chart is rendered in IE and in Chrome but.. The lines are rendered just in the Chrome,

Highcharts plotLine drag xAxis event

I would like to drag a plotLine on xAxis and detect this change. Can someone please provide an example ? Edit @DiMono Here is what I have tried so far. The click event is not firing. By this approach I would like to add, dragstart, dragend etc events

Toggle Highcharts plotLine with button

Good afternoon guys, Just a very quick one: I was wondering whether it'd be possible to toggle a PlotLine (on/off) without having to remove it and then have to add it from scratch. The reason for this is that I am building my charts from a PHP array

Highcharts: removes the space between the plot border and the actual chart

We are migrating from a flash based charting library (FusionCharts) to a JavaScript based one (HighCharts). This is what our current flash charts look like And this is what I've got so far with HighCharts. How can I remove the space (marked with big

Highchart highlight the area between points with custom colors

I have a Highchart which displays earth and water pressure data (stored in the Database). I want to mark the area between the various points on x-axis with different colors which marks the type of area from where the data was collected. I have the co

Highcharts: Tooltip on a single series only

I have 3 datasets within my series (low, normal, high) displaying on a scatter plot. How can I force the tooltip and markers to be enabled only for the normal data set? Many thanksformatter: Function Callback function to format the text of the toolti

Highcharts do not issue JSON series

I'm having trouble finding out what is wrong with how I'm setting the chart series in Highcharts. The chart outline renders but the series doesn't which indicates something wrong with the data set. After being parsed, the JSON data being pulled in lo

Highcharts - error when updating a series to have fewer categories than previously

I'm having an issue with updating a highcharts chart when the new data has fewer columns (categories) than it had previously. Fiddle: http://jsfiddle.net/ggoforth/bZAF7/ Consider I have a chart like: var chart = new Highcharts.Chart({ chart: { render

Highcharts legend does not show series names

I'm working on a simple project, and I'm trying to create a chart. Everything works perfectly except the fact that the legend is not showing the series name. This is the fiddle. HTML: <div id="container" style="height: 400px"><

Highcharts shared tooltip for line series and scatterplot not working

I have a highchart with a couple of line series and a scatter plot and I have set the shared tooltip property to true as in this fiddle http://jsfiddle.net/tpo4caoz/. I see that the line series are having a shared tool tip but the scatter plot is hav

Highcharts JS: the space between X-Axis labels is too thin

The gap between the labels in the X-Axis is to small, when i scale the window size and more labels can be shown. The Highcharts engine calculates the gap and set at different break points a gap of zero. The labels touching each other and for this pro

Pandas indexing methods and tuples as parameters

Let's say I have a pandas Series, and I want to access a set of elements at specific indices, like so: In [1]: from pandas import Series import numpy as np s = Series(np.arange(0,10)) In [2]: s.loc[[3,7]] Out[2]: 3 3 7 7 dtype: int64 The .loc method

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK