Могу ли я одушевлять заговорные полосы и помещать более одного ярлыка в каждую полосу полосы, используя API Highstock?

Question

Я использую API-интерфейс highstock, и я хочу нарисовать некоторые диаграммы на диаграмме. Я хотел бы знать, есть ли способ анимировать полосу полосы во время ее рисования, например, переходы CSS, применяемые к элементам html при изменении их ширины. Я также хочу знать, могу ли я назначить более одного ярлыка одному полосе. Я видел много примеров в jsfiddle, где в полосе полосы есть только один ярлык, но я хотел бы поместить две метки для каждой полосы, чтобы показать ее начальную точку и ее конечную точку.

Заранее спасибо.

Answer 1

Вы можете использовать функцию Renderer.rect и активировать функцию animate() на визуализированном объекте, вместо использования зазоров. В результате анимируется новая форма.

var yAxis = chart.yAxis[0], 
     xAxis = chart.xAxis[0], 
     start = 1, 
     end = 2, 
     x1 = xAxis.toPixels(start), 
     x2 = xAxis.toPixels(end); 

    var plotBand = chart.renderer.rect(x1, chart.plotTop, 0, chart.plotHeight) 
     .attr({ 
      fill: 'yellow', 
      zIndex: 0 
     }) 
     .add(); 

     plotBand.animate({ 
      width: x2 - x1 
     }); 

Пример:

• http://jsfiddle.net/qvt5mvdL/