0

我需要在 HTML 5 / JavaScript Tee 图表上绘制垂直和水平矩形/带（如甘特图）。

我可以使用下面的 Bar 系列绘制一个矩形，但我希望矩形浮动在特定的 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 绘制一个矩形。我想绘制具有特定 x1、y1、x2 和 y2 值的甘特图中的矩形。

我尝试在 Teecharts 中使用格式对象，但没有帮助

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

4

2 回答 2

1

使用 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

于 2012-06-08T13:26:32.063 回答
0

下一个 TeeChart Javascript v1.1 将包括甘特系列。这是演示： http: //www.steema.us/files/jscript/demos/series/gantt/gantt.htm

我们很高兴听到有关它的任何评论。

Steema 支持中心

于 2012-06-12T07:09:59.433 回答