时间戳

首页 > 解决方案 > 在图表后插入文本块

javascript - 在图表后插入文本块

问题描述

我的页面上有几个图表，我怎样才能确保在中心的每个图表之后仍然有文字？

https://jsfiddle.net/0xkq98sv/1/

window.onload = function() {
            let container = document.querySelector('.chart-container');

        [{"name":"test","description":"test","date":[1577203210000,1577206808000,1577210408000],"profitInBTC":[0.0,-0.79,0.87],"profitInUSDT":[0.0,-0.51,0.36]},{"name":"puz","description":"puz","date":[1582665302212,1582668005727,1582671603990],"profitInBTC":[0.0,-0.5,14.72],"profitInUSDT":[15.4,15.41,15.41]}].forEach(function(snapshot) {

            let chartcont = document.createElement('div');
            chartcont.className = 'chart';
            let desc = document.createElement('div');
            desc.className = 'desc-container';
            desc.innerHTML = snapshot.description;

            container.append(desc);
            container.append(chartcont);


            var config = createConfig(snapshot);

            Highcharts.stockChart(chartcont, config);


        });

    };

标签： javascripthtmlcsshighcharts

解决方案

.chart-container{
   flex-direction: column;
}

.desc-container {
    text-align: center;
    display: block;
}

根据你的 jsfiddle flex-direction:row; 将使用 flex-direction:column 将其子项设置为行（彼此相邻）；将每个子项显示为一行，全部作为一列。

推荐阅读