1ページに約6つのチャートがあり、そのうちの1つは他の5つのテーマとは異なるテーマを持つ必要があります。個別に作業するテーマがありますが、初期化された2つ目のテーマはすべてのチャートに適用されます。Highcharts.js - 複数のテーマが同じページにありますか?
チャートで使用するテーマを指定する方法はありますか?
1ページに約6つのチャートがあり、そのうちの1つは他の5つのテーマとは異なるテーマを持つ必要があります。個別に作業するテーマがありますが、初期化された2つ目のテーマはすべてのチャートに適用されます。Highcharts.js - 複数のテーマが同じページにありますか?
チャートで使用するテーマを指定する方法はありますか?
Ricardoのコメントを読んだあと、$(document).ready呼び出しの中でsetOptions()呼び出しを移動するだけで済むことに気付きました。
私のコードの多くの簡易版:
Highcharts.theme1 = {
chart: {
borderWidth: 0,
},
};
var chart;
$(document).ready(function() {
// Apply the theme
var highchartsOptions = Highcharts.setOptions(Highcharts.theme1);
// Build the chart
chart = new Highcharts.Chart({});
});
Highcharts.theme2 = {
chart: {
borderWidth: 5,
},
};
var chart2;
$(document).ready(function() {
// Apply the theme
var highchartsOptions = Highcharts.setOptions(Highcharts.theme2);
// Build the chart
chart = new Highcharts.Chart({});
});
ベストプラクティスは、現在お使いのchart options
をテーマにマージすることになります。
chart1 = new Highcharts.Chart(Highcharts.merge(options1, theme1));
var options1 = {
// options goes here
chart: {
renderTo: 'chart1',
type: 'bar',
},
title: {
text: 'Conversions'
},
};
var theme1 = {
// themes goes here
};
var chart1 = new Highcharts.Chart(Highcharts.merge(options1, theme1));
あなたが設定することができます。この方法必要に応じて各グラフの個別のテーマを設定します
Cあなたはデモを見せますか?おそらく 'Highcharts.setOptions()'を使用しています。これは、呼び出し後に作成されたすべてのチャートのオプションを設定します。 –
はい、まさに私がやっていたことです。私はあなたのコメントを読んだ後、私はsetOptions()呼び出しをチャートを作成する関数の中に移動し、今は動作します:) –
ハハ、素晴らしい! :) –