Можно ли добавить название в диаграммы?

Я хочу добавить заголовок в диаграмму, например, в

EDIT: я обнаружил, что существует свойство создавать текстовые спрайты для названия или любых меток в Ex.draw пакете. но я не мог понять, как его использовать.

anybdy здесь сделали то же самое?

Ответ 1

Так как Ext.chart.Chart является компонентом Ext.draw.Component, вы можете добавить спрайты в качестве его элементов. Попытайтесь использовать это:

Ext.create('Ext.chart.Chart', {
   default chart settings here

   ...

   items: [{
      type  : 'text',
      text  : 'Simple Title',
      font  : '14px Arial',
      width : 100,
      height: 30,
      x : 50, //the sprite x position
      y : 10  //the sprite y position
   }]
})

Ответ 2

Вы можете просто добавить спрайт в корзину .surface:

var chart = Ext.create('Ext.chart.Chart', {
    ... default chart settings here ...
});
var sprite = Ext.create('Ext.draw.Sprite', {
    type: 'text',
    surface: chart.surface,
    text: 'Simple text',
    font: '12px Arial',
    x: 50,
    y: 0,
    width: 100,
    height: 100 
});
sprite.show(true);
chart.surface.add(sprite);

Надеюсь, что это поможет.

Ответ 3

Просто поместите свою диаграмму внутри панели с нужным названием.

Ext.create('Ext.panel.Panel', {
    title: 'My Title',
    layout: 'fit',
    items: yourChart
});

Ответ 4

Да, вы можете использовать Ext.chart.axis.Gauge. Внутри элементов поместите конфигурацию оси с заголовком:

Ext.create('Ext.chart.Chart', {
   default chart settings here

   ...

   items: [{
                axes: [
                    {
                        position: 'gauge',
                        type: 'Gauge',
                        title: 'Net Pips',
                        maximum: 500,
                        minimum: 0
                    }
                ]
   }]
})

Ответ 5

Я бы порекомендовал не использовать спрайт, так как вы, вероятно, захотите, чтобы заголовок был в центре. Любые изменения в размере контейнера или длине вашего текста не будут обрабатываться автоматически, поскольку подходы спрайтов, описанные в других ответах здесь, все жестко определяют местоположение. Центрирование с помощью спрайта может быть выполнено с некоторыми усилиями, но я бы подумал об использовании системы макетов. Таким образом, содержимое вашей страницы может автоматически позиционироваться при изменении размера вашей страницы.

// Use a vbox layout with whatever options you need
layout: {
    type: 'vbox',
    align: 'center'
},
items: [{
    type: 'container',
    html: 'My Title'
},{
    type: 'chart',
    flex: 1,
    // ...etc
}];