Subversion-Projekte lars-tiefland.cienc

/**
 * Gray theme for Highcharts JS
 * @author Torstein Honsi
 */

Highcharts.theme = {
        colors: ["#DDDF0D", "#7798BF", "#55BF3B", "#DF5353", "#aaeeee", "#ff0066", "#eeaaee",
                "#55BF3B", "#DF5353", "#7798BF", "#aaeeee"],
        chart: {
                backgroundColor: {
                        linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
                        stops: [
                                [0, 'rgb(96, 96, 96)'],
                                [1, 'rgb(16, 16, 16)']
                        ]
                },
                borderWidth: 0,
                borderRadius: 0,
                plotBackgroundColor: null,
                plotShadow: false,
                plotBorderWidth: 0
        },
        title: {
                style: {
                        color: '#FFF',
                        font: '16px Lucida Grande, Lucida Sans Unicode, Verdana, Arial, Helvetica, sans-serif'
                }
        },
        subtitle: {
                style: {
                        color: '#DDD',
                        font: '12px Lucida Grande, Lucida Sans Unicode, Verdana, Arial, Helvetica, sans-serif'
                }
        },
        xAxis: {
                gridLineWidth: 0,
                lineColor: '#999',
                tickColor: '#999',
                labels: {
                        style: {
                                color: '#999',
                                fontWeight: 'bold'
                        }
                },
                title: {
                        style: {
                                color: '#AAA',
                                font: 'bold 12px Lucida Grande, Lucida Sans Unicode, Verdana, Arial, Helvetica, sans-serif'
                        }
                }
        },
        yAxis: {
                alternateGridColor: null,
                minorTickInterval: null,
                gridLineColor: 'rgba(255, 255, 255, .1)',
                minorGridLineColor: 'rgba(255,255,255,0.07)',
                lineWidth: 0,
                tickWidth: 0,
                labels: {
                        style: {
                                color: '#999',
                                fontWeight: 'bold'
                        }
                },
                title: {
                        style: {
                                color: '#AAA',
                                font: 'bold 12px Lucida Grande, Lucida Sans Unicode, Verdana, Arial, Helvetica, sans-serif'
                        }
                }
        },
        legend: {
                itemStyle: {
                        color: '#CCC'
                },
                itemHoverStyle: {
                        color: '#FFF'
                },
                itemHiddenStyle: {
                        color: '#333'
                }
        },
        labels: {
                style: {
                        color: '#CCC'
                }
        },
        tooltip: {
                backgroundColor: {
                        linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
                        stops: [
                                [0, 'rgba(96, 96, 96, .8)'],
                                [1, 'rgba(16, 16, 16, .8)']
                        ]
                },
                borderWidth: 0,
                style: {
                        color: '#FFF'
                }
        },


        plotOptions: {
                series: {
                        nullColor: '#444444'
                },
                line: {
                        dataLabels: {
                                color: '#CCC'
                        },
                        marker: {
                                lineColor: '#333'
                        }
                },
                spline: {
                        marker: {
                                lineColor: '#333'
                        }
                },
                scatter: {
                        marker: {
                                lineColor: '#333'
                        }
                },
                candlestick: {
                        lineColor: 'white'
                }
        },

        toolbar: {
                itemStyle: {
                        color: '#CCC'
                }
        },

        navigation: {
                buttonOptions: {
                        symbolStroke: '#DDDDDD',
                        hoverSymbolStroke: '#FFFFFF',
                        theme: {
                                fill: {
                                        linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
                                        stops: [
                                                [0.4, '#606060'],
                                                [0.6, '#333333']
                                        ]
                                },
                                stroke: '#000000'
                        }
                }
        },

        // scroll charts
        rangeSelector: {
                buttonTheme: {
                        fill: {
                                linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
                                stops: [
                                        [0.4, '#888'],
                                        [0.6, '#555']
                                ]
                        },
                        stroke: '#000000',
                        style: {
                                color: '#CCC',
                                fontWeight: 'bold'
                        },
                        states: {
                                hover: {
                                        fill: {
                                                linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
                                                stops: [
                                                        [0.4, '#BBB'],
                                                        [0.6, '#888']
                                                ]
                                        },
                                        stroke: '#000000',
                                        style: {
                                                color: 'white'
                                        }
                                },
                                select: {
                                        fill: {
                                                linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
                                                stops: [
                                                        [0.1, '#000'],
                                                        [0.3, '#333']
                                                ]
                                        },
                                        stroke: '#000000',
                                        style: {
                                                color: 'yellow'
                                        }
                                }
                        }
                },
                inputStyle: {
                        backgroundColor: '#333',
                        color: 'silver'
                },
                labelStyle: {
                        color: 'silver'
                }
        },

        navigator: {
                handles: {
                        backgroundColor: '#666',
                        borderColor: '#AAA'
                },
                outlineColor: '#CCC',
                maskFill: 'rgba(16, 16, 16, 0.5)',
                series: {
                        color: '#7798BF',
                        lineColor: '#A6C7ED'
                }
        },

        scrollbar: {
                barBackgroundColor: {
                                linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
                                stops: [
                                        [0.4, '#888'],
                                        [0.6, '#555']
                                ]
                        },
                barBorderColor: '#CCC',
                buttonArrowColor: '#CCC',
                buttonBackgroundColor: {
                                linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
                                stops: [
                                        [0.4, '#888'],
                                        [0.6, '#555']
                                ]
                        },
                buttonBorderColor: '#CCC',
                rifleColor: '#FFF',
                trackBackgroundColor: {
                        linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
                        stops: [
                                [0, '#000'],
                                [1, '#333']
                        ]
                },
                trackBorderColor: '#666'
        },

        // special colors for some of the demo examples
        legendBackgroundColor: 'rgba(48, 48, 48, 0.8)',
        background2: 'rgb(70, 70, 70)',
        dataLabelsColor: '#444',
        textColor: '#E0E0E0',
        maskColor: 'rgba(255,255,255,0.3)'
};

// Apply the theme
var highchartsOptions = Highcharts.setOptions(Highcharts.theme);