Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/457.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 带有图标标记的Highcharts插件isn';t点_Javascript_Highcharts_Font Awesome - Fatal编程技术网

Javascript 带有图标标记的Highcharts插件isn';t点

Javascript 带有图标标记的Highcharts插件isn';t点,javascript,highcharts,font-awesome,Javascript,Highcharts,Font Awesome,Highcharts的一个例子是,它提供了一个插件,允许将图标呈现为图表上的点 我试图在我正在进行的项目中加入相同的内容,但是,当我向图表中添加一个点时(通过手动更改单个系列中的数据对象,或者通过调用系列的添加点方法),该点不会显示。但是,轴确实会得到更新 在这个JSFIDLE示例中,我在顶部包含了插件,为图表提供了一些基本的默认选项来填充轴,然后尝试添加一些点。以下是此示例中的相关代码: // Generate the event series if undefined if (typeof

Highcharts的一个例子是,它提供了一个插件,允许将图标呈现为图表上的点

我试图在我正在进行的项目中加入相同的内容,但是,当我向图表中添加一个点时(通过手动更改单个
系列中的
数据
对象,或者通过调用系列的
添加点
方法),该点不会显示。但是,轴确实会得到更新

在这个JSFIDLE示例中,我在顶部包含了插件,为图表提供了一些基本的默认选项来填充轴,然后尝试添加一些点。以下是此示例中的相关代码:

// Generate the event series if undefined
if (typeof eventChartOptions.options.series == 'undefined')
    eventChartOptions.options.series = [];

// Populate the event series based on data in events object
eventChartOptions.options.series.push(
    {
        data: [[174.0, 65.6]],
        marker: {
            symbol: 'text:\uf183' // fa-male
        },
        icon: '\uf183',
        name: 'Male',
        color: 'rgba(119, 152, 191, 0.6)'
    }
);

eventChart = new Highcharts.Chart(eventChartOptions.options);
在渲染的图表上,yAxis被更新为包含新值(174),但图标不可见:

在Highcharts自己的示例和我的代码之间进行一点比较,可以发现我的系列缺少一个图形对象:

Highcharts系列点阵列(工作) 我的系列点阵列(不工作)
我在这里做错了什么?

我认为您的数据不适用于您试图放置图标的x轴

你一直在使用

// Populate the event series based on data in events object
    eventChartOptions.options.series.push(
        {
            data: [[174.0, 65.6]] ,
            marker: {
                symbol: 'text:\uf183' // fa-male
            },
            icon: '\uf183',
            name: 'Male',
            color: 'rgba(119, 152, 191, 0.6)'
        }
    );
表示
65.4
的值,该值与为另一轴定义的范围(如
1390219200000

改为

// Populate the event series based on data in events object
eventChartOptions.options.series.push({
    data: [
        [174.0, 1390219200000]
    ],
    marker: {
        symbol: 'text:\uf183' // fa-male
    },
    icon: '\uf183',
    name: 'Male',
    color: 'rgba(119, 152, 191, 0.6)'
});
即使是在90度的情况下,也能让人感觉到吗


演示:

它是这样呈现的,因为
chart.inversed
选项设置为true。啊,当然!我根本没有考虑轴值,非常感谢!
// Populate the event series based on data in events object
    eventChartOptions.options.series.push(
        {
            data: [[174.0, 65.6]] ,
            marker: {
                symbol: 'text:\uf183' // fa-male
            },
            icon: '\uf183',
            name: 'Male',
            color: 'rgba(119, 152, 191, 0.6)'
        }
    );
// Populate the event series based on data in events object
eventChartOptions.options.series.push({
    data: [
        [174.0, 1390219200000]
    ],
    marker: {
        symbol: 'text:\uf183' // fa-male
    },
    icon: '\uf183',
    name: 'Male',
    color: 'rgba(119, 152, 191, 0.6)'
});