我有一种产品,我们的客户可以选择日期范围。对于我们的工具之一,我们使它们成为具有其数据高图的面积图。

我注意到,当面积图在x轴上有一个数据点时,没有显示任何图形。这是JSFiddle中的一个示例:
http://jsfiddle.net/gh/get/jquery/1.9.1/highslide-software/highcharts.com/tree/master/samples/highcharts/demo/area-basic/

后代代码如下:

$(function () {
    $('#container').highcharts({
        chart: {
            type: 'area'
        },
        title: {
            text: 'US and USSR nuclear stockpiles'
        },
        subtitle: {
            text: 'Source: <a href="http://thebulletin.metapress.com/content/c4120650912x74k7/fulltext.pdf">'+
                'thebulletin.metapress.com</a>'
        },
        xAxis: {
            allowDecimals: false,
            labels: {
                formatter: function() {
                    return this.value; // clean, unformatted number for year
                }
            }
        },
        yAxis: {
            title: {
                text: 'Nuclear weapon states'
            },
            labels: {
                formatter: function() {
                    return this.value / 1000 +'k';
                }
            }
        },
        tooltip: {
            pointFormat: '{series.name} produced <b>{point.y:,.0f}</b><br/>warheads in {point.x}'
        },
        plotOptions: {
            area: {
                pointStart: 1940,
                marker: {
                    enabled: false,
                    symbol: 'circle',
                    radius: 2,
                    states: {
                        hover: {
                            enabled: true
                        }
                    }
                }
            }
        },
        series: [{
            name: 'USA',
            data: [10104 ]
        }, {
            name: 'USSR/Russia',
            data: [16000]
        }]
    });
});


奇怪的是:图表为空,但将鼠标悬停在图表上时,可以看到数据点。有什么方法可以使这些点不悬停而可见?也许给刻度线一个宽度的选项?

谢谢!

最佳答案

在您的示例中,当我删除除最后一个数据点以外的所有数据时,我会看到您在说什么。这是因为在此示例中,未启用marker。为此,将其更改为true

    plotOptions: {
        area: {
            pointStart: 1940,
            marker: {
                enabled: true, //this was false.
                symbol: 'circle',
                radius: 2,
                states: {
                    hover: {
                        enabled: true
                    }
                }
            }
        }
    },

关于javascript - Highcharts面积图隐藏具有一个数据点的图形,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/23939524/

10-12 16:49
查看更多