Difference between revisions of "Geometria básica no plano: áreas e perímetros"

From JSXGraph Wiki
Jump to navigationJump to search
Line 10: Line 10:
 
<jsxgraph box="box">
 
<jsxgraph box="box">
 
  var board = JXG.JSXGraph.initBoard('box', {boundingbox: [-5, 5, 5, -5], axis:true});
 
  var board = JXG.JSXGraph.initBoard('box', {boundingbox: [-5, 5, 5, -5], axis:true});
−
  var po    = board.createElement('point',[0,0], {name:'O',style:5,fixed:true});
+
  var po    = board.create('point',[0,0], {name:'O',style:5,fixed:true});
−
  var pa    = board.createElement('point',[2,2], {name:'A',style:5});
+
  var pa    = board.create('point',[2,2], {name:'A',style:5});
−
  var pb    = board.createElement('point',["X(A)",0], {name:'B',style:5});
+
  var pb    = board.create('point',["X(A)",0], {name:'B',style:5});
−
  var t    = board.createElement('polygon',["O","A","B"]);
+
  var t    = board.create('polygon',["O","A","B"]);
−
  var tarea = board.createElement('text',[3,2.0,function(){area = 0.5*Math.abs(pa.Y()*pb.X());return "&aacute;rea = "+area.toFixed(6);}]);
+
  var tarea = board.create('text',[3,2.0,function(){area = 0.5*Math.abs(pa.Y()*pb.X());return "&aacute;rea = "+area.toFixed(6);}]);
−
  var tperi = board.createElement('text',[2.45,2.5,function(){
+
  var tperi = board.create('text',[2.45,2.5,function(){
 
  b = Math.abs(pa.X()); h = Math.abs(pa.Y());
 
  b = Math.abs(pa.X()); h = Math.abs(pa.Y());
 
  p = b+h+Math.sqrt(b*b+h*h);return "per&iacute;metro = "+p.toFixed(6);}]);
 
  p = b+h+Math.sqrt(b*b+h*h);return "per&iacute;metro = "+p.toFixed(6);}]);
−
  var h    = board.createElement('text',[3.35,3.50,function(){altura=Math.abs(pa.Y());return "h = "+altura.toFixed(6);}]);
+
  var h    = board.create('text',[3.35,3.50,function(){altura=Math.abs(pa.Y());return "h = "+altura.toFixed(6);}]);
−
  var b    = board.createElement('text',[3.35,3.00,function(){base  =Math.abs(pa.X());return "b = "+base.toFixed(6);}]);
+
  var b    = board.create('text',[3.35,3.00,function(){base  =Math.abs(pa.X());return "b = "+base.toFixed(6);}]);
 
</jsxgraph>
 
</jsxgraph>
  
Line 34: Line 34:
 
<jsxgraph box="box2">
 
<jsxgraph box="box2">
 
  var board = JXG.JSXGraph.initBoard('box2', {boundingbox: [-5, 5, 5, -5], axis:true});
 
  var board = JXG.JSXGraph.initBoard('box2', {boundingbox: [-5, 5, 5, -5], axis:true});
−
  var l1s  = board.createElement('line', [[0,0], [1,1]],{strokeWidth:0});  
+
  var l1s  = board.create('line', [[0,0], [1,1]],{strokeWidth:0});  
−
  var pas  = board.createElement('point',[2,2], {name:'A',style:5,slideObject:l1s});
+
  var pas  = board.create('point',[2,2], {name:'A',style:5,slideObject:l1s});
−
  var pbs  = board.createElement('point',["X(A)" ,"-Y(A)"], {name:'B',style:5});
+
  var pbs  = board.create('point',["X(A)" ,"-Y(A)"], {name:'B',style:5});
−
  var pcs  = board.createElement('point',["-X(A)","-Y(A)"], {name:'C',style:5});
+
  var pcs  = board.create('point',["-X(A)","-Y(A)"], {name:'C',style:5});
−
  var pds  = board.createElement('point',["-X(A)","Y(A)" ], {name:'D',style:5});
+
  var pds  = board.create('point',["-X(A)","Y(A)" ], {name:'D',style:5});
−
  var s    = board.createElement('polygon',["A","B","C","D"]);
+
  var s    = board.create('polygon',["A","B","C","D"]);
−
  var sarea = board.createElement('text',[3  ,2.5,function(){side=2*Math.abs(pas.X());area = side*side;return "&aacute;rea = "+area.toFixed(6);}]);  
+
  var sarea = board.create('text',[3  ,2.5,function(){side=2*Math.abs(pas.X());area = side*side;return "&aacute;rea = "+area.toFixed(6);}]);  
−
  var speri = board.createElement('text',[2.45,3.0,function(){side=2*Math.abs(pas.X());peri = 4*side  ;return "per&iacute;metro = "+peri.toFixed(6);}]);  
+
  var speri = board.create('text',[2.45,3.0,function(){side=2*Math.abs(pas.X());peri = 4*side  ;return "per&iacute;metro = "+peri.toFixed(6);}]);  
−
  var a    = board.createElement('text',[3.40,3.5,function(){side=2*Math.abs(pas.X());return "a = "+side.toFixed(6);}]);
+
  var a    = board.create('text',[3.40,3.5,function(){side=2*Math.abs(pas.X());return "a = "+side.toFixed(6);}]);
 
</jsxgraph>
 
</jsxgraph>
  
Line 57: Line 57:
 
<jsxgraph box="box3">
 
<jsxgraph box="box3">
 
  var board = JXG.JSXGraph.initBoard('box3', {boundingbox: [-5, 5, 5, -5], axis:true});
 
  var board = JXG.JSXGraph.initBoard('box3', {boundingbox: [-5, 5, 5, -5], axis:true});
−
  var par  = board.createElement('point',[2,2], {name:'A',style:5});
+
  var par  = board.create('point',[2,2], {name:'A',style:5});
−
  var pbr  = board.createElement('point',["X(A)" ,"-Y(A)"], {name:'B',style:5});
+
  var pbr  = board.create('point',["X(A)" ,"-Y(A)"], {name:'B',style:5});
−
  var pcr  = board.createElement('point',["-X(A)","-Y(A)"], {name:'C',style:5});
+
  var pcr  = board.create('point',["-X(A)","-Y(A)"], {name:'C',style:5});
−
  var pdr  = board.createElement('point',["-X(A)","Y(A)" ], {name:'D',style:5});
+
  var pdr  = board.create('point',["-X(A)","Y(A)" ], {name:'D',style:5});
−
  var r    = board.createElement('polygon',["A","B","C","D"]);
+
  var r    = board.create('polygon',["A","B","C","D"]);
−
  var rperi = board.createElement('text',[2.45,2.5,function(){
+
  var rperi = board.create('text',[2.45,2.5,function(){
 
  sidea=Math.abs(par.X());
 
  sidea=Math.abs(par.X());
 
  sideb=Math.abs(par.Y());
 
  sideb=Math.abs(par.Y());
Line 72: Line 72:
 
  area = sidea*sideb;
 
  area = sidea*sideb;
 
  return "&aacute;rea = "+area.toFixed(6);}]);
 
  return "&aacute;rea = "+area.toFixed(6);}]);
−
  var ar    = board.createElement('text',[3.35,3.50,function(){sidea=2*Math.abs(par.X());return "a = "+sidea.toFixed(6);}]);
+
  var ar    = board.create('text',[3.35,3.50,function(){sidea=2*Math.abs(par.X());return "a = "+sidea.toFixed(6);}]);
−
  var br    = board.createElement('text',[3.35,3.00,function(){sideb=2*Math.abs(par.Y());return "b = "+sideb.toFixed(6);}]);
+
  var br    = board.create('text',[3.35,3.00,function(){sideb=2*Math.abs(par.Y());return "b = "+sideb.toFixed(6);}]);
 
</jsxgraph>
 
</jsxgraph>
  
Line 88: Line 88:
 
<jsxgraph box="box4">
 
<jsxgraph box="box4">
 
  var board = JXG.JSXGraph.initBoard('box4', {boundingbox: [-5, 5, 5, -5], axis:true, keepAspectRatio:true});
 
  var board = JXG.JSXGraph.initBoard('box4', {boundingbox: [-5, 5, 5, -5], axis:true, keepAspectRatio:true});
−
  var poc    = board.createElement('point',[0,0], {name:'O',style:5,fixed:true});
+
  var poc    = board.create('point',[0,0], {name:'O',style:5,fixed:true});
−
  var prc    = board.createElement('point',[2,2], {name:'P',style:5});
+
  var prc    = board.create('point',[2,2], {name:'P',style:5});
−
  var c    = board.createElement('circle',[[0,0], ["X(P)","Y(P)"]],
+
  var c    = board.create('circle',[[0,0], ["X(P)","Y(P)"]],
 
{strokeColor:'#0000ff',strokeWidth:3,fillColor:'#cccccc',fillOpacity:0.3});
 
{strokeColor:'#0000ff',strokeWidth:3,fillColor:'#cccccc',fillOpacity:0.3});
−
  var vr    = board.createElement('line',["O","P"],  
+
  var vr    = board.create('line',["O","P"],  
 
{strokeColor:'#0000ff',strokeWidth:3,straightFirst:false,straightLast:false,firstArrow:true,lastArrow:true});
 
{strokeColor:'#0000ff',strokeWidth:3,straightFirst:false,straightLast:false,firstArrow:true,lastArrow:true});
−
  var carea = board.createElement('text',[2.6,2.5,
+
  var carea = board.create('text',[2.6,2.5,
 
  function(){radius=Math.sqrt(prc.X()*prc.X()+prc.Y()*prc.Y());area = Math.PI*radius*radius;return "&aacute;rea = "+area.toFixed(6);}]);
 
  function(){radius=Math.sqrt(prc.X()*prc.X()+prc.Y()*prc.Y());area = Math.PI*radius*radius;return "&aacute;rea = "+area.toFixed(6);}]);
−
  var r    = board.createElement('text',[2.95,3.50,
+
  var r    = board.create('text',[2.95,3.50,
 
  function(){radius=Math.sqrt(prc.X()*prc.X()+prc.Y()*prc.Y());return "r = "+radius.toFixed(6);}]);
 
  function(){radius=Math.sqrt(prc.X()*prc.X()+prc.Y()*prc.Y());return "r = "+radius.toFixed(6);}]);
−
  var cperim = board.createElement('text',[2,3.00,
+
  var cperim = board.create('text',[2,3.00,
 
  function(){radius=Math.sqrt(prc.X()*prc.X()+prc.Y()*prc.Y());perimeter=2*Math.PI*radius;return "per&iacute;metro = "+perimeter.toFixed(6);}]);
 
  function(){radius=Math.sqrt(prc.X()*prc.X()+prc.Y()*prc.Y());perimeter=2*Math.PI*radius;return "per&iacute;metro = "+perimeter.toFixed(6);}]);
 
</jsxgraph>
 
</jsxgraph>

Revision as of 12:55, 23 June 2021

  • Triângulo rectângulo: b = base, h = altura, logo área = ( b × h )/2 e perímetro = b + h + (b2+h2)1/2.

    Arraste o ponto A para ver a variação do perímetro e da área com a variação da base e da altura:

  • Quadrado: a = lado (ou aresta), logo área = a2 e perímetro = 4a.

    Arraste o ponto A para ver a variação do perímetro e da área com a variação da aresta:

  • Rectangulo: a = lado 1, b = lado 2, logo área = a×b e perímetro = 2a + 2b.

    Arraste o ponto A para ver a variação do perímetro e da área com a variação dos lados:

  • Círculo: r = raio do círculo, logo área = πr2 e perímetro = 2πr.

    Arraste o ponto P para ver a variação do perímetro da circunferência e da área do círculo com a variação do raio:

Última alteração em 23/07/2009

Todos os gráficos interactivos foram criados com recurso à livraria JSXGraph.

Retrieved from "http://jsxgraph.org/wiki/index.php?title=Geometria_básica_no_plano:_áreas_e_perímetros&oldid=7444"