将Y轴动态添加到第一张图表底部的高图中,而不会减小前一张图表的尺寸

问题描述 投票:0回答:2

我正在尝试将新的Y轴和系列添加到已初始化图表底部的已初始化图表。现在,当我添加Y轴时,它会添加到同一级别。我尝试添加“顶部”(从图表顶部偏移),但是由于已初始化图表的区域固定(400像素),因此新图表被裁剪。我尝试在添加新轴之前增加容器的高度,但仍然无法正常工作。销毁图表并重新绘制图表非常麻烦,而且我认为这不是最佳方法。

let charts = Highcharts.charts;

           charts.forEach((chart, index) => {
               if (chart.renderTo.id === `chart-${item.x}`) {
                   this.chosenChart = chart;
                   this.chosenChart.containerHeight = this.chosenChart.chartHeight + 400;
                   this.chosenChart.addAxis({
                       id: item.y,
                       title: {
                           text: item.dimensions[0].name
                       },
                       height: '50%',
                      top: `${top}%`

                   });
               }
javascript highcharts angular8
2个回答
0
投票

Highchart尺寸及其容器的宽度和高度。

即使您将容器高度更改为上面的代码,也无法使用。您的第2个yaxis始终类似于此Example 2 yaxis

因此,如果您的数据像Highstock,我建议您使用2张图表或高位股票>

Highcharts.chart('container', {
    chart: {
        marginRight: 80 // like left
    },
    xAxis: {
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
    },
    yAxis: [{
        lineWidth: 1,
        title: {
            text: 'Primary Axis'
        }
    }, {
        lineWidth: 1,
        opposite: true,
        title: {
            text: 'Secondary Axis'
        }
    }],

    series: [{
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
    }, {
        data: [144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4, 29.9, 71.5, 106.4, 129.2],
        yAxis: 1
    }]
});
<div id="container" style="height: 400px"></div>
<script src="https://code.highcharts.com/highcharts.js"></script>

0
投票

使用highcharts的setSize来增加容器的大小。

© www.soinside.com 2019 - 2024. All rights reserved.