【问题标题】:How to add scroll on highcharts multiple drilldown如何在 highcharts 多个向下钻取上添加滚动
【发布时间】:2019-04-12 15:48:28
【问题描述】:

我正在使用 highcharts,现在我们有这么多项目,我需要一些东西让它可读和可滚动,我添加了缩放属性,但它不符合要求,有什么想法吗?

这是我的代码:

Highcharts.theme = {
    colors: ["#7cb5ec", "#f7a35c", "#90ee7e", "#7798BF", "#aaeeee", "#ff0066", "#eeaaee", "#55BF3B", "#DF5353", "#7798BF", "#aaeeee"],
    chart: {
        zoomType: 'x',
        backgroundColor: null,
        style: {
            fontFamily: "Dosis, sans-serif"
        }
    },
    title: {
        style: {
            fontSize: '16px',
            fontWeight: 'bold',
            textTransform: 'uppercase'
        }
    },
    tooltip: {
        borderWidth: 0,
        backgroundColor: 'rgba(219,219,216,0.8)',
        shadow: false
    },
    legend: {
        itemStyle: {
            fontWeight: 'bold',
            fontSize: '13px'
        }
    },
    xAxis: {
        gridLineWidth: 1,
        labels: {
            style: {
                fontSize: '12px'
            }
        }
    },
    yAxis: {
        minorTickInterval: 'auto',
        title: {
            style: {
                textTransform: 'uppercase'
            }
        },
        labels: {
            style: {
                fontSize: '12px'
            }
        }
    },
    plotOptions: {
        candlestick: {
            lineColor: '#404048'
        }
    },
    scrollbar: {
        enabled: true
    },
    // General
    background2: '#F0F0EA'
};

我现在已经添加了 zoomType: 'x',但我也需要使用可滚动的。我应该使用什么属性?我已经尝试过 highstock,但它不适用于向下钻取图表。

【问题讨论】:

    标签: javascript charts highcharts visualization


    【解决方案1】:

    使用可以使用scrollablePlotArea属性。此外,向下钻取适用于 Highstock:http://jsfiddle.net/BlackLabel/9ap2sj7k/

    chart: {
        scrollablePlotArea: {
            minWidth: 1200
        }
    }
    

    现场演示:http://jsfiddle.net/BlackLabel/b0f2dq3g/

    API:https://api.highcharts.com/highcharts/chart.scrollablePlotArea

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多