extJs (проблема Hbox) - PullRequest
       5

extJs (проблема Hbox)

0 голосов
/ 21 марта 2012

Я разрабатываю портал как в http://dev.sencha.com/deploy/ext-4.0.7-gpl/examples/portal/portal.html.Я разработал следующий код, который показывает панель с двумя элементами. Их высота и ширина настраиваются автоматически.Но я хочу сделать так, чтобы они стояли в ряд. В настоящее время второй элемент размещается под первым элементом. Я заменил vbox на hbox, но диаграмма просто исчезла.Пожалуйста, помогите ....

Ваша помощь приветствуется

 Ext.define("Ext.app.ChartPortlet",    {extend:"Ext.panel.Panel",alias:"widget.chartportlet",requires:  ["Ext.data.JsonStore","Ext.chart.theme.Base","Ext.chart.series.Series","Ext.chart.series.Li      ne","Ext.chart.axis.Numeric"],
  generateData:function(){var b=[{name:"x",djia:10000,sp500:1100}],a;for(a=1;a<50;a++)    {b.push({name:"x"+a,sp500:b[a-1].sp500+    ((Math.floor(Math.random()*2)%2)?-1:1)*Math.floor(Math.random()*7),djia:b[a-1].djia+       ((Math.floor(Math.random()*2)%2)?-1:1)*Math.floor(Math.random()*7)})}return b}
   ,initComponent:function()
    {Ext.apply(this,{layout: {
    type: 'vbox',
      align: 'stretch'
    }
    ,width:600,height:300,items:
    [{xtype:"chart",animate:false,shadow:false,store:Ext.create("Ext.data.JsonStore",
   {fields:["name","sp500","djia"],data:this.generateData()}),legend:            {position:"bottom"},axes:[{type:"Numeric",position:"left",fields:["djia"],
    title:"Dow Jones Average",label:{font:"11px Arial"}},    {type:"Numeric",position:"right",grid:false,fields:["sp500"],title:"S&P 500",label:  {font:"11px Arial"}}],
    series:[{type:"line",lineWidth:1,showMarkers:false,fill:true,axis:    ["left","bottom"],xField:"name",yField:"djia",style:{"stroke-width":1}},       {type:"line",lineWidth:1,showMarkers:false,
     axis:["right","bottom"],xField:"name",yField:"sp500",style:{"stroke-width":1}}]}]


      });this.callParent(arguments)}});

1 Ответ

0 голосов
/ 21 марта 2012

Код, который вы показываете, использует VBox с выравниванием растяжения, что означает, что элементы будут размещены друг под другом. Выровнять растяжение означает, что их ширина должна занимать 100 процентов родительского контейнера, поэтому вы не должны указывать ширину. Ваш текущий код как отправлено: http://jsfiddle.net/dbrin/kcd9g/show/light/ Я исправил пропавшие без вести; и настройки ширины, остальное ваше.

...