2

最小/最大値を使用して副軸を設定しようとしていますが、主軸が副軸の最大値を上書きすることがよくあります。

alignTicks:false を使用できることはわかっていますが、目盛りの表示方法が好きではありません。また、軸の 1 つの目盛りを非表示にできることも知っていますが、やはり見た目が気に入りません。

右側に強制的に最小/最大を使用させ、適切なティック間隔を把握させたいか、左側に特定のティック数を強制させたいと思います。

いくつかのアイデアが必要です。ここに私のコードといくつかのモックデータを含む jsfiddle があります。

http://jsfiddle.net/2s6kK/

$(function () {
    $('#container').highcharts({
        "title": {
            "text": ""
        },
        "subtitle": {
            "text": ""
        },
        "xAxis": {
            "type": "datetime",
            "dateTimeLabelFormats": {
                "day": "%b %e"
            }
        },
        "yAxis": [{
            "min": 0,
            "startOnTick": false,
            "labels": {
                "style": {
                    "color": "#4074C3"
                }
            },
            "title": {
                "text": "Revenue",
                "style": {
                    "color": "#4074C3"
                },
                "margin": 5
            },
            "index": 0
        }, {
            "allowDecimals": false,
            "min": 0,
            "max": 100,
            "maxPadding": 0.2,
            "startOnTick": false,
            "labels": {
                "style": {
                    "color": "#8DAD36"
                }
            },
            "title": {
                "text": "Win Rate",
                "style": {
                    "color": "#8DAD36"
                },
                "margin": 2
            },
            "opposite": true,
            "index": 1,
//        "alignTicks": false
        }],
        "legend": {
            "enabled": true,
            "align": "center",
            "verticalAlign": "top",
            "x": 0,
            "y": -5,
            "borderWidth": 0
        },
        "series": [{
            "name": "Revenue",
            "type": "line",
            "yAxis": 0,
            "data": [5.4,27,27,27,58,0, 0, 0, 0
            ],"pointStart":1377993600000,"pointInterval":86400000
        }, {
            "name": "Win Rate",
            "type": "line",
            "color": "#8DAD36",
            "yAxis": 1,
            "data": [60,48,48,48,48,60, 0, 0, 0, 0
            ],"pointStart":1377993600000,"pointInterval":86400000
        }]
    });
});

ありがとう、ジョシュ

4

1 に答える 1

1

y 軸の定義で tickInterval を 10 に設定してみてください。

"tickInterval": 10

http://jsfiddle.net/2s6kK/1/

于 2013-09-09T22:16:33.457 に答える