Ortala Başlığı Google Grafik

Question

nasıl titlePosition gibi herhangi seçenekleri görmüyorsanız

Google Charts API (Not Google Grafik Görüntüler) bir çizgi grafik başlığı ortalayabilmek: 'merkez'

Teşekkür !

function drawVisualization() { 
    // Create and populate the data table. 
    var data = google.visualization.arrayToDataTable([ 
    ['xValues', 'yValues'], 
    [0, 34.92], 
    [389, 39.44], 
    [488, 52.11], 
    [652, 55.4] 
    ]); 

    var options = { 
    curveType: 'none', // 'function' 
    title: 'Title', 
    titleTextStyle: { 
     color: '333333', 
     fontName: 'Arial', 
     fontSize: 10 
    }, 
    legend: 'none', 
    enableInteractivity: false 
    }; 

    var chart = new google.visualization.LineChart(document.getElementById('visualization')); 
    chart.draw(data, options); 
} 

Bu seçenek the API tarafından sağlanmaz

Answer 1

; Bunu sadece yapamazsın.

Answer 2

Another answer gibi bir şey önerir aşağıdadır:

$("text:contains(" + vencOptions.title + ")").attr({'x':'60', 'y':'20'}) 

Kaynak: Kullandığım https://stackoverflow.com/a/16291236/364

Answer 3

: titlePosition: 'none'

Ve Normal HTML ile bir başlık eklemek

Answer 4

You Çizildikten ve biraz o sonra grafikten geri arama bilgisi ile bunu kolayca yapabilirsiniz Bir matematikte bir metin üzerinde çalışan matematik.

Grafiğinizi bir konumda içerir: relative div. Grafiğin altına bir div ekleyin ve hem onu ​​hem de grafiği mutlak olarak yerleştirin.

Bundan sonra, divanın üstteki & sol konumlarını küçük bir lise matematiği ile taşıyabilirsiniz.

<https://jsfiddle.net/o6zmbLvk/2/> 

Answer 5

grafiği çizdikten sonra, olay işleyici işlevi çağırır:

google.visualization.events.addListener(chart, 'ready', Title_center); 

Ve işlevi tanımlayın:

function Title_center(){ 

    var title_chart=$("#payer_chart_div svg g").find('text').html(); 

    $("#payer_chart_div svg").find('g:first').html('<text text-anchor="start" x="500" y="141" font-family="Arial" font-size="18" font-weight="bold" stroke="none" stroke-width="0" fill="#000000">'+title_chart+'</text>'); 
} 

Sadece grafiğin başlığını takın ve özellikler eklemek X:500 , y:141.

Answer 6

$("#YOUR_GRAPH_WRAPPER svg text").first() 
    .attr("x", (($("#time-series-graph svg").width() - $("#YOUR_GRAPH_WRAPPER svg text").first().width())/2).toFixed(0)); 

See my explanation here

Answer 7

$("text:contains(" + vencOptions.title + ")").attr({'x':'60', 'y':'20'}) 

// TD

$("#YOUR_GRAPH_WRAPPER svg text").first().attr("x", (($("#time-series-graph svg").width() - parseInt($("#YOUR_GRAPH_WRAPPER svg text").first().attr('x'),10))/2).toFixed(0)); 

Answer 8

Document.getElementById ('divid'). GetElementsByTagName (text ') [0] .setAttribute ('x', '350')