Javascript/HTML: Format Positionierung für ein Balkendiagramm

Wie gezeigt, mein Bargraph tendiert am oberen Teil der meiner Seite zu erscheinen. Ich möchte, dass es unten erscheint, damit ich den Titel meines Projekts über die Balkendiagramme setzen kann. Ich bin mir nicht sicher über die richtige Syntax für Javascript. Hier ist der Code für meine Bargraph ..

<!DOCTYPE html> 
<html> 
<head> 
<script src="http://cdnjs.cloudflare.com/ajax/libs/raphael/2.1.0/raphael-min.js"></script> 
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script> 
    <script src="http://cdn.oesmith.co.uk/morris-0.4.1.min.js"></script> 
<meta charset=utf-8 /> 
<title> Project Blue Summary </title> 
</head> 


<body> 
    <div id="bar-example"></div> 

<script> 
Morris.Bar({ 
    element: 'bar-example', 
    data: [ 
    { y: 'SM Mall of Asia', a: 500, b: 390 }, 
    { y: 'SM Megamall', a: 750, b: 650 }, 
    { y: 'SM North Edsa', a: 350, b: 240 }, 
    { y: 'SM Aura', a: 700, b: 250 }, 
    { y: 'Robinson\'s Manila', a: 150, b: 340 }, 
    { y: 'Robinson\'s Cebu', a: 725, b: 625 }, 
    { y: 'Ayala Cebu', a: 100, b: 400 }, 
    { y: 'Rockwell', a: 135, b: 235 }, 
    { y: 'Serendra', a: 200, b: 815 }, 
    { y: 'Bel-Air', a: 750, b: 550 }, 
    { y: 'Festival Mall', a: 450, b: 120 }, 
    { y: 'Adriatico', a: 250, b: 90 }, 
    { y: 'UP Twon Center', a: 120, b: 490 }, 
    { y: 'Greenhills', a: 500, b: 270 }, 
    { y: 'Glorietta/Greenbelt', a: 600, b: 450 } 
    ], 
    xkey: 'y', 
    ykeys: ['a', 'b'], 
    labels: ['AMEX', 'With BDO Terminal'] 
}); 


</script> 
</body> 
</html>

Quelle

2016-07-20 lexus

Wenn ich das richtig verstehen, könnten Sie etwas wie folgt verwenden:

var bar = document.getElementById('bar-example'); 
    var w = window.innerWidth 
    || document.documentElement.clientWidth 
    || document.body.clientWidth; 

    var h = window.innerHeight 
    || document.documentElement.clientHeight 
    || document.body.clientHeight; 

    console.log(w+" "+h); 

    bar.style.width = w+"px"; 
    bar.style.height = h+"px";

Andere Lösung, wenn Sie JQuery verwenden

var bar = $('#bar-example'); 
    var wi = $(document).width(); 
    var he = $(document).height(); 
    bar.css({'width':wi, 'height':he});

oder ein Linienweg

$('#bar-example').css({'width':$(document).width(), 'height':$(document).height()});

wenn diese nicht für dich arbeiten, lass es mich wissen :)

Quelle

2016-07-20 09:47:26

Javascript/HTML: Format Positionierung für ein Balkendiagramm

Antwort

Verwandte Themen