Нарисуйте прямоугольник на HTML 5/Javascript Teechart

Question

Мне нужно нарисовать вертикальные и горизонтальные прямоугольники/полосы (как в диаграммах Ганта) на диаграммах HTML 5/JavaScript Tee.

Я мог бы нарисовать прямоугольник с помощью ряда баров, как показано ниже, но я хочу, чтобы прямоугольник плавал на определенной XY-координате, скорее стоящей от оси x.

var series1 = new Tee.Bar(); 
        series1.data.values = [30000]; 
        //alert(" openValues[y] "+ openValues[y] + " closeValues[y] "+ closeValues[y]); 
        series1.data.x = [ (openValues[y] + closeValues[y]) /2 ]; 
        series1.format.shadow.visible = false; 
        series1.format.lineCap = "round"; 
        series1.format.stroke.fill = "#D3D3D3"; 
        series1.format.stroke.size = .5; 
        series1.colorEach = "auto"; 
        series1.format.join = "round"; 
        series1.format.cap = "square"; 
        series1.format.fill="#F8F8FF"; 
        series1.barSize=100000; 
        //series1.format.transparent =1; 
        series1.color = "silver"; 
        series1.marks.visible = false; 
        //series1.hover.shadow =false; 
        series1.hover.stroke.size =.01; 
        Chart1.addSeries(series1); 

Можно ли просто нарисовать прямоугольник с использованием HTML 5/Javascript Teecharts. Я хочу рисовать прямоугольники, как в диаграмме gantt, с определенными значениями x1, y1, x2 и y2.

Я попытался с помощью форматирования объекта в Teecharts, но это не помогло

Chart1.panel.format.rectPath (20,20,30,40);

Answer 1

Следующая v1.1 TeeChart Javascript будет incude Серии Ганта , Вот демо-версия: http://www.steema.us/files/jscript/demos/series/gantt/gantt.htm

Мы будем рады услышать любые комментарии по этому поводу.

Steema Support Central

Answer 2

Чтобы нарисовать простой прямоугольник, используя html5 ...

window.onload = function() { 
    var canvas = document.getElementById('myCanvas'); 
    var context = canvas.getContext('2d'); 

    context.beginPath(); 
    context.rect(188, 50, 200, 100); 
    context.fillStyle = '#8ED6FF'; 
    context.fill(); 
    context.lineWidth = 5; 
    context.strokeStyle = 'black'; 
    context.stroke(); 
    }; 

здесь пример ссылка для диаграммы Ганта с использованием html5

http://www.eecg.toronto.edu/~brousse1/Libraries/RGraph/docs/gantt.html