Posted on

HighChartsでhighcarts.comへのリンクを消す方法

ブラウザ上でグラフを描画するライブラリはたくさんあるのですが、最近、多くの商用サイトで使われているのがこれだと思います↓

HighCharts JS

こんな感じのグラフを作ることが出来ます↓
HighCharts Demo

見栄えやグラフの描画され方が洗練されていて、プロ仕様のチャートライブラリです。
商用目的の使用は有料なのですが、非商用目的なら無料ですので、実験的に使ってみられても面白いかと思います。JQueryベースの無料のチャートライブラリでも結構すごいのがあるのですが、やはり仕事で使うとなると有料でもHighChartを使う場面が増えてきています。

さて、このHighChart、デフォルトの状態ではこの折れ線グラフのようにチャートの右隅にhighcharts.comというロゴが表示され、クリックするとHighChartsのサイトへとジャンプしてしまいます。

このリンクの表示を消すには、チャートの初期化時に以下のように書けば大丈夫です。

$("HighChartsのグラフを表示する領域").highcharts({
chart: {…}
colors: [{…}]
credits
: {
enabled: false,
}
});

デフォルトでは上記のcreditsの動作がenabled:trueの動きをしておりますので、明示的にcreditsのenabledをfalseにしてやればチャート右下のリンクは消えてくれます。

せっかくかっこいいチャートを使ったサイトができても、他の企業へのリンクが付いてるままではカッコがつきませんので(^^;、どうぞご活用くださいませ