我从highcharts得到example

我想使yAxis标签(在示例中为0k,50k ..)不在垂直线上



但是像这样的对角线上



我一直在搜索highchart的文档,但在yAxis标签上找不到某些属性可以做到这一点,或者我错了,我在highchart's docs上尝试过某些属性,但还是没有运气

yAxis: {
    gridLineInterpolation: 'polygon',
    lineWidth: 0,
    min: 0,
    labels: {
      ...
    }
},


请建议如何做
非常感谢 !

最佳答案

您可以使用pane.startAngle旋转整个图形,请参见:http://jsfiddle.net/xEAxK/381/

或者使用包装方法负责定位该点并编辑半径以使用不同于axis.startAngleRad的方法:http://jsfiddle.net/xEAxK/385/

码:

(function (H) {
    H.wrap(H.Tick.prototype, 'getLabelPosition', function (proceed, x, y, label, horiz, labelOptions, tickmarkOffset, index, step) {
        var rot = this.axis.isXAxis ? this.axis.startAngleRad : -2.5 * Math.PI / 4,
            origRot = this.axis.startAngleRad,
            axis = this.axis,
            optionsY = labelOptions.y,
            ret;

        axis.startAngleRad = rot;

            centerSlot = 20, // 20 degrees to each side at the top and bottom
            align = labelOptions.align,
            angle = ((axis.translate(this.pos) + rot + Math.PI / 2) / Math.PI * 180) % 360;


        if (axis.isRadial) {
            ret = axis.getPosition(this.pos, (axis.center[2] / 2) + H.pick(labelOptions.distance, -25));

            // Automatically rotated
            if (labelOptions.rotation === 'auto') {
                label.attr({
                    rotation: angle
                });

                // Vertically centered
            } else if (optionsY === null) {
                optionsY = axis.chart.renderer.fontMetrics(label.styles.fontSize).b - label.getBBox().height / 2;
            }

            // Automatic alignment
            if (align === null) {
                if (axis.isCircular) {
                    if (this.label.getBBox().width > axis.len * axis.tickInterval / (axis.max - axis.min)) { // #3506
                        centerSlot = 0;
                    }
                    if (angle > centerSlot && angle < 180 - centerSlot) {
                        align = 'left'; // right hemisphere
                    } else if (angle > 180 + centerSlot && angle < 360 - centerSlot) {
                        align = 'right'; // left hemisphere
                    } else {
                        align = 'center'; // top or bottom
                    }
                } else {
                    align = 'center';
                }
                label.attr({
                    align: align
                });
            }

            ret.x += labelOptions.x;
            ret.y += optionsY;

        } else {
            ret = proceed.call(this, x, y, label, horiz, labelOptions, tickmarkOffset, index, step);
        }
        axis.startAngleRad = origRot;
        return ret;
    });
})(Highcharts);

关于javascript - 在对 Angular 线上显示yAxis标签,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/31283077/

10-09 17:26