28

Highchartを使用しています。各系列が独自のy軸を持つ複数系列のグラフがあります。

これとほとんど同じです（jsfiddle）

シリーズの凡例アイテムをクリックすると、そのアイテムと関連するy軸が非表示になります（軸showEmpty:falseの名前も非表示になります）。

私が達成しようとしているのは、シリーズ自体を非表示にすることなく、特定のシリーズのy軸を非表示にすることです。

次のようにshowAxisプロパティを変更して非表示にしようとしました。

serie.yAxis.showAxis = false;

しかし、それは機能しません。誰もが私がどうすべきか知っていますか？

編集：テキストをnullに設定して軸のタイトルを削除できるようにテキストを編集できましたが、軸全体とその値を非表示にするのに十分ではありません。

これが私がテキストを編集するためにしたことです：

serie.yAxis.axisTitle.attr({
            text: null
        });
4

4 に答える 4

54

Highcharts 4.1.9+

4.1.9以降、軸の表示/非表示に使用できるオプションAxis.visibleがあります。デモ：http： //jsfiddle.net/3sembmfo/36/

Highchartsの古いバージョン

これはHighcharts3.0の新機能であり、軸をリアルタイムで更新できます。chart.yAxis[0].update(object)オブジェクトはチャートの作成と同じオプションを使用します。例えば：

        chart.yAxis[0].update({
            labels: {
                enabled: false
            },
            title: {
                text: null
            }
        });

そしてjsFiddle： http: //jsfiddle.net/39xBU/2/

編集：

axis.hide()以下のスニペットを使用して、とを呼び出すだけで軸を表示/非表示にしaxis.show()ます。ライブデモ： http： //jsfiddle.net/39xBU/183/

(function (HC) {
    var UNDEFINED;
    HC.wrap(HC.Axis.prototype, 'render', function (p) {
        if (typeof this.visible === 'undefined') {
            this.visible = true;
        }
        if(this.visible) {
            this.min = this.prevMin || this.min;
            this.max = this.prevMax || this.max;
        } else {
            this.prevMin = this.min;
            this.prevMax = this.max;
            this.min = UNDEFINED;
            this.max = UNDEFINED;
        }

        this.hasData = this.visible;

        p.call(this);
    });

    HC.Axis.prototype.hide = function () {
        this.visible = false;
        this.render();

        HC.each(this.plotLinesAndBands, function (plotLine) {
            plotLine.render();
        });
    };

    HC.Axis.prototype.show = function () {
        this.visible = true;
        this.render();

        HC.each(this.plotLinesAndBands, function (plotLine) {
            plotLine.render();
        });
    };
})(Highcharts);
于 2013-03-08T10:57:57.860 に答える
4

実際にはもっと簡単になりました。yAxistitle属性をfalseに設定するだけで済みます。

yAxis: {
   title: false
},

次に例を示します。jsfiddleの例

于 2019-01-18T09:27:53.683 に答える
-1

次のように空の文字列を返すことで、系列を非表示にせずにy軸を非表示にせずにY軸ラベルを非表示にできます。

yAxis: {
       title: '',
       labels: {
                formatter: function() {
                    return '';
                },
                style: {
                    color: '#4572A7'
                }
        }

}、

于 2018-08-30T10:21:23.400 に答える
-1

新しいバージョン（私は6.2.0を使用しています）の場合、プロパティにはgridLineWidthyAxisというパラメーターがあります。0に設定するだけで、その軸のグリッドが消えます。このJSFiddleにはその例があります。

ただし、スタイルモードの場合、これは注意が必要です。ここでは、ターゲット軸にclassNameを設定してから、次のようにCSSを設定する必要があります。

.highcharts-yaxis-grid {
    &.right-axis {
      path {
        stroke: none;
      }
    }
  }

たとえば、これにより、右軸classNameとして設定された軸のグリッドが消えます。これにより、複数の軸に異なるスタイルを設定できます。

于 2019-07-11T11:30:04.143 に答える