円グラフ（道場）でプロットを移動

Question

実際のデータと実際のデータの両方のターゲットを持つグラフを作成しようとしています。私は実際のデータバーの背後にターゲットデータバーを表示し、ターゲットデータプロットを少し左に移動しようとしています。このよう

：

は、私は、全体のプロットを移動しようとしたが、私はどのように見つけることができませんでした。私は別のy軸を追加すると、軸を左に動かすことも、軸とプロットのギャップを小さくすることもできますが、私のインターネット検索では結果は見つかりません（すべての結果が.setAxisWindow ）私が知っているのはパニングのためだが、それを使う方法はあるのだろうか？）。

これは私が現在持っているスクリプトです：

function setupChart(Chart, theme, Columns, Highlight) 
{ 
    var realData = [2.50,3.45,1.22,1.86,2.54, 4.01, {y:3.10, color : 'green'}]; 
    var targetData = [2.00,2.00,2.00,2.86,2.54, 2.00, 2.00]; 

    var chart = new Chart("weekElectricBar", {title: 'Daily Heating Cost', titleGap: 0, titleFont: 'bold normal normal 15px Tahoma', titleFontColor: "black"}); 

    chart.setTheme(theme); 

    chart.addPlot("default", { 
     type: "Columns", 
     markers: true, 
     gap: 5, 
     font: "bold normal 14px Tahoma", 
     fontColor: "Black", 
     shadows: {dx:4, dy:4} 
    }); 

    chart.addPlot("back", { 
     type: "Columns", 
     vAxis: "other y", 
     markers: true, 
     gap: 5, 
     font: "bold normal 14px Tahoma", 
     fontColor: "Black", 
     shadows: {dx:4, dy:4} 
    }); 
    chart.addAxis("other y", { type : 'Invisible', includeZero: true, fixUpper: 'major', vertical: true, min: 0, max:5}); 

    chart.addAxis("y", {includeZero: true, fixUpper: 'major', vertical: true, min: 0, max:5, labels: [{value: 0, text: "£0"}, {value: 1, text: "£1"}, {value: 2, text: "£2"}, {value: 3, text: "£3"}, {value: 4, text: "£4"}, {value: 5, text: "£5"}] }); 
    chart.addAxis("x", {labels: [{value: 1, text: "Wed"}, {value: 2, text: "Thurs"}, {value: 3, text: "Fri"}, {value: 4, text: "Sat"}, {value: 5, text: "Sun"}, {value: 6, text: "Mon"}, {value: 7, text: "Last 24 Hrs"}]}); 

    chart.addSeries("realData",realData, {plot: "back"}); 
    chart.addSeries("targetData",targetData); 

    chart.render(); 
} 

また、それだけで1列に「ギャップ」プロパティを増加させることが可能であるかもしれませんか？それを見るもう1つの方法は、クラスタ化された列を使用し、クラスタ化された列間のギャップを減らすことですが、可能だとは思いません。

Answer 1

私はこの効果を達成するチートを使用しているので、これを行う方法がないようです。通常の列（最初に追加される）とクラスター化された列（1つの系列がすべて0）のプロットを追加することによって機能します。すべての列の幅は等しくなるように設定されています。

これは私が今持っているものです。

function setupWeekElectricBar(Chart, theme, ClusteredColumns, Columns) 
{ 
    var realData = [2.50,3.45,1.22,1.86,2.54, 4.01, {y:3.10, color: 'green'}]; // a new array 
    var blankData = [0,0,0,0,0]; // a new array 

    var targetData = [2.00,2.00,2.00,2.86,2.54, 2.00, 2.00]; 

    var chart = new Chart("weekElectricBar", {title: 'Daily Heating Cost', titleGap: 0, titleFont: 'bold normal normal 15px Tahoma', titleFontColor: "black"}); 

    chart.setTheme(theme); 

    chart.addPlot("default", { 
     type: ClusteredColumns, 
     markers: true, 
     gap: 5, 
     minBarSize : 40, 
     maxBarSize : 40, 
     font: "bold normal 14px Tahoma", 
     fontColor: "Black", 
     shadows: {dx:4, dy:4} 
    }); 

    chart.addPlot("back", { 
     type: Columns, 
     markers: true, 
     gap: 5, 
     minBarSize : 40, 
     maxBarSize : 40, 
     font: "bold normal 14px Tahoma", 
     fontColor: "Black", 
     shadows: {dx:4, dy:4} 
    }); 

    chart.addAxis("y", {includeZero: true, fixUpper: 'major', vertical: true, min: 0, max:5, labels: [{value: 0, text: "£0"}, {value: 1, text: "£1"}, {value: 2, text: "£2"}, {value: 3, text: "£3"}, {value: 4, text: "£4"}, {value: 5, text: "£5"}] }); 
    chart.addAxis("x", {labels: [{value: 1, text: "Wed"}, {value: 2, text: "Thurs"}, {value: 3, text: "Fri"}, {value: 4, text: "Sat"}, {value: 5, text: "Sun"}, {value: 6, text: "Mon"}, {value: 7, text: "Last 24 Hrs"}]}); 

    chart.addSeries("blankData",blankData, {width: 2}); 
    chart.addSeries("realData",realData); 
    chart.addSeries("targetData",targetData, {plot:'back'}); 

    chart.render(); 
}