标签: highcharts

我有以下代码的小提琴链接：

$(function () {
$('#container').highcharts({
    chart: {
    },
    xAxis: {
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
    },

    plotOptions: {
        series: {
            dataLabels: {
                align: 'left',
                enabled: true,
                rotation: 270,
                x: 2,
                y: -10
            }
        }
    },

    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]        
    }]
  });
});

我想向上和向下显示数据标签（例如在线上显示点一月/三月/五月，在线下显示点（二月/四月/六月）。有人知道如何实现这一点吗？

谢谢。

我需要更改 highchart 上云中的字体大小。怎么做？

HTML：

<script src="http://code.highcharts.com/highcharts.js"></script>
<div id="container" style="height: 400px"></div>

JavaScript：

$(function () {
    $('#container').highcharts({
        xAxis: {
            categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
        },
        title: {
            style: {
                color: '#FF00FF',
                fontWeight: 'bold'
            }
        },
        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]
        }]
    });
});

JSFiddle：http://jsfiddle.net/autrmg62/

屏幕：

我正在寻找类似下面的东西

有什么办法可以实现这一点吗？

我有一个 HighCharts 树形图，显示一组包含子类别的类别。该图的要点是显示有多少数据属于类别 A，以及有多少数据属于类别 A1。

我的创建如下：

http://jsfiddle.net/jbcfk93m/

$(function () {
$('#container').highcharts({
    series: [{
        colorByPoint: true,
        layoutAlgorithm: "stripes",
        alternateStartingDirection: true,
        allowPointSelect: true,
        point: {
            events: {
                click: function () {
                        alert(this.name + ": " + this.value);
                    }
                }
        },
        dataLabels: {

        },
        type: "treemap",
        levels: [{
            level: 1,
            dataLabels: {
                enabled: true,
                align: 'right',
                rotation: 30,
                crop: false,
                overflow: 'none',
                inside: false,
                style: {
                    fontSize: '15px',
                    fontWeight: 'bold'
                }
            }
        }, {
            level: 2,
            dataLabels: {
                style: {
                }
            },
            layoutAlgorithm: …

speedometer我想像 中那样显示箭头Highcharts solidgauge graph。是否可以？

插件链接：http://www.highcharts.com/demo/gauge-solid
版本：4.1.9

我很难在 highcharts 的行顶部添加标签..例如假设我有 4 个系列（全部可见），名称为'data', 'mean', '+1 std', '-1 std'：

我想要的结果是：

我不知道如何添加它......即使有了文档，我似乎也需要为每个标签添加横坐标和纵坐标。我怎样才能检索这些信息？添加系列的时候可以直接添加标签吗？

        chart.addSeries({
            id           : 'mean',
            name         : 'mean',
            type         : 'line',
            lineWidth    : 1,
            lineColor    : 'rgba(0,128,0,0.9)',
            color        : 'rgba(0,128,0,0.9)',
            dashStyle    : 'LongDash',
            zIndex       : 5,
            data         : [[ext.dataMin, mean], [ext.dataMax, mean]],
            enableMouseTracking: false
        });

请注意，我不想在图例中显示此信息，而是在图表本身上显示 -

是否可以在折线图的数据标签上显示我自己的文本，仅适用于非零条目。假设要在数据标签中显示的文本与数据一起从 xml 传递。

我需要如下图所示的图表。请提出一个想法。谢谢你的时间。

高图表：

 xAxis: {
            categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
        },

        plotOptions: {
            series: {
                dataLabels: {
                    enabled: true,
                    formatter: function () {
                        if (this.point.y != 0) {
                            return this.point.y;
                        }
                    },
                    borderRadius: 5,
                    backgroundColor: 'pink',
                    borderWidth: 1,
                    borderColor: 'green',
                    y: -6
                }
            }
        },

        series: [{
            data: [0, 0,77,120,0,0,150,0,0,0,0]
        }]

}

XML：

<categories>
    <month>Jan</month>
    <month>Feb</month>
    <month>Mar</month>
    <month>Apr</month>
    <month>May</month>
    <month>Jun</month>
    <month>Jul</month>
    <month>Aug</month>
    <month>Sep</month>
    <month>Oct</month>
    <month>Nov</month>
    <month>Dec</month>
  </categories>
    <Series> …

如何将“2016-03-08T14:47:39.231Z”转换为可以在 highcharts 中使用的纪元毫秒时间？

我在一页上有一些图表，每个图表都有自己的边框框。首页加载的所有图表都超过其父图表的宽度。

如果我稍微调整页面宽度，一切都会恢复到应有的样子。奇怪的是，这只出现在最新的 Chrome 版本上。Safari 和 FF 运行良好。

另一个奇怪的问题是，如果我empty cache and hard reload在 Chrome 中，它加载正常。刷新页面，图表就会显示在其容器的右侧。

我已经从研究中尝试过这个CSS：

.highcharts-container {
  width:100% !important;
  height:100% !important;
}

但这也会搞乱 Chrome 和其他浏览器上的工具提示。

欢迎任何建议。

观察下面示例中的系列 1 具有恒定值，并且不会绘制该系列点的连接线，但当我们给出纯色时，将绘制该线。

当我们使用线条渐变颜色时，具有常量系列的 Highchart 折线图不会绘制线条黑白点，但如果将其更改为纯色，则将绘制线条。

highcharts.series[].data = [2, 2, 2, ...];
highcharts.color[0] = {
   linearGradient: {...},
   stop: {...}
};

检查此示例： https: //jsfiddle.net/4vk7cdmz/