svg 기반 Google 차트를 중앙 정렬하는 방법 (절대 위치를 갖고 있기 때문에)

Question

새로운 (예 : svg 기반) Google 차트를 중앙 정렬하는 방법을 알고 계신 분 있으십니까? 나는 '

<div style="position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; "> 
<svg width="800" height="500" style="overflow: hidden; "> 

: 나는 my web page에서 차트 요소를 검사 할 때

(해당 페이지에서 여러 구글 차트와 jQuery를 탭으로 스크롤하십시오), 나는 차트 자체가 absolute 위치를 주어진 것을 볼 m 확실하지 구글은 그것을 않습니다,하지만 (차트 나를 위해 잘 작동 이외의) 내 레이아웃을 나누기 이유 :

내 CSS 코드 :

를 17,451,515,

h1,h2,h3,p,div,form { 
    text-align: center; 
} 

그리고도 추가 시도했다 :

margin-left: auto; 
    margin-right: auto; 

내 자바 스크립트 코드 :

var money_data; 
var money_chart; 
var money_options = { 
     width: 800, 
     height: 500, 
     legend: {position: 'top'}, 
     areaOpacity: 1.0, 
     vAxis: {format: '# $'}, 
     hAxis: {title: 'Номер недели', titleTextStyle: {color: 'blue'}, slantedText: true, viewWindow: {min: 39, max: 52}}, 
     colors: ['CCFFCC', '66CC66', 'FF9999'], 
     animation: {duration: 1000, easing: 'out'} 
}; 

function initMoney() { 
     $.ajax({ 
       url: '/money-json.php', 
       data: { id: 'OK408547485023' }, 
       dataType: 'json' 
     }).done(function(jsonData) { 
       money_data = new google.visualization.DataTable(jsonData); 
       money_chart = new google.visualization.SteppedAreaChart(document.getElementById('money_chart')); 
       google.visualization.events.addListener(money_chart, 'ready', function() { 
         $('#money_slider').slider('enable'); 
       }); 
       drawMoney(); 
     }); 
} 

function drawMoney() { 
     money_chart.draw(money_data, money_options); 
} 

여기에 어떤 CSS 기반 솔루션 가능하다면, 나는 어쩌면 이동 자바 스크립트를 사용할 수 SVG를 money_slider과 같은 x- 위치로 바꾸고 (위 코드 참조)?

Answer 1

money_chart DIV의 크기를 그래프 크기 (800px로 추측)로 설정하고 자동 여백을 사용할 수 있습니다.

#money_chart{ 
    margin-left: auto; 
    margin-right: auto; 
    width: 800px; 
} 

Answer 2

당신은 다른 사업부가 여기 내 코드 차트 측을해야합니다 그리고 그것은 나를

.chart_outside{ 
     position:relative; 
     display: inline; 
     border: 2px solid #FFF; 
     width: 500px; 
     height: 460px; 
     background: #000; 
     margin: 5px 5px 5px 5px; 
     } 

.chart_inside{ 
     position:absolute; 
     right:0px 
     ;top:0px; 
     } 

작동