Rgraph折线图样条创建幽灵图

Question

试图弄清楚这里发生了什么。当我第一次加载带有图表的页面时，我得到以下信息：

然而，在我刷新它之后，我得到以下信息：

这是正在呈现的代码：

    setTimeout(function(){  
                    new RGraph.SVG.Line({
                        id: 'sbfefinancialtrend2',
                        data: [
                                12.754546,  
                                18.771622, 
                                21.15946, 
                                6.198649, 
                                19.645947, 
                                13.724324, 
                                14.481081, 
                                6.0878377, 
                                22.671621, 
                                8.917568, 
                                14.263514, 
                                9.281081, 
                                20.340542, 
                                13.485135, 
                                5.727027, 
                                7.964865, 
                                7.1932435, 
                                4.8932433, 
                                8.136486, 
                                6.9445944, 
                                5.428378, 
                                7.268919, 
                                5.85, 
                                4.6, 
                                7.3581085, 
                                5.685135, 
                                9.606757, 
                                19.431429, 
                                11.982858, 
                                11.364285, 
                                1.9033333, 
                                8.645714, 
                                6.535714, 
                                          
                         ],      
                        options: {
                            backgroundGridLinewidth:0.5,
                            backgroundGridVlinesCount: 36,
                            marginInner: 0,
                            textColor: '#595959',
                            textFont: 'Roboto',
                            filled: true,
                            filledColors: ['rgba(219,193,218,0.7)'],
                            colors: ['#a30a7a'],
                            marginRight: 10,
                            marginBottom: 30,
                            marginTop: 10,
                            xaxis: false,
                            yaxis: false,
                            tickmarksFill: '#a30a7a',
                            tickmarksLinewidth: 1,
                            linewidth: 1,
                            spline: true
                        }
                    }).trace().responsive([ 
                        {width: 750,height:130,options: 
                        {xaxisLabels: [
                            'F20',                                       
                            'J20',                                       
                            'D19',                                       
                            'N19',                                       
                            'O19',                                       
                            'S19',                                       
                            'A19',                                       
                            'J19',                                       
                            'J19',                                       
                            'M19',                                       
                            'A19',                                       
                            'M19',                                       
                            'F19',                                       
                            'J19',                                       
                            'D18',                                       
                            'N18',                                       
                            'O18',                                       
                            'S18',                                       
                            'A18',                                       
                            'J18',                                       
                            'J18',                                       
                            'M18',                                       
                            'A18',                                       
                            'M18',                                       
                            'F18',                                       
                            'J18',                                       
                            'D17',                                       
                            'N17',                                       
                            'O17',                                       
                            'S17',                                       
                            'A17',                                       
                            'J17',                                       
                            'J17',                                       
                        ],
                        xaxisLabelsAngle:45,marginLeft: 30,textSize: 8,tickmarksStyle: 'circle',tickmarksSize: 3,linewidth: 2},
                        css:{'float':'right'}}
                    ]);},1000);

我用超时包装它以尝试解决问题。然而这并没有帮助。

有什么建议吗？

感谢您的帮助！

Answer 1

你的代码在我的测试页上对我有用。你可以在这里看到：

https://www.rgraph.net/tests/svg.line/natdrip.html

尽管您可以尝试将此添加到您的代码中：

.on('beforedraw', function ()
{
    RGraph.SVG.clear('cc');
}).trace()

Rgraph折线图样条创建幽灵图

Rgraph line chart spline creating ghost chart

javascript

svg

rgraph