gpt4 book ai didi

javascript - T 形图中同一 Canvas 上的多个图形

转载 作者:可可西里 更新时间:2023-11-01 13:10:46 26 4
gpt4 key购买 nike

使用 teecharts 评估副本中的示例,我们尝试在同一 Canvas 上绘制多个图表,但它不起作用。它所做的只是简单地绘制最后绘制的图形(在 if (three.isEnabled()) { 部分内),并忽略在它之前绘制的图形。

var three, Chart1, Chart2, surface;

function draw() {

// Create 3D WebGL context:
three = new Tee.Three("canvas1");

// Create Chart:
Chart1 = new Tee.Chart(three);

Chart2 = new Tee.Chart(three);
Chart1.walls.visible=false;

// Create Surface:
surface = new Tee.Surface();

// Add Surface series to Chart:
Chart1.addSeries(surface);
Chart2.addSeries(new Tee.Line()).addRandom(1000);

changeSurface("s3");
// Cosmetics:

Chart1.title.text="TeeChart Surface 3D";
Chart1.walls.back.size=0.2;
Chart1.walls.back.format.transparency=0.2;

// Valid webGL ?

if (three.isEnabled()) {

Chart1.draw();
Chart2.draw();

animate();
}
else
Detector.addGetWebGLMessage(); // Show message (WebGL not available)

// Loop
function animate() {
three.update();
requestAnimationFrame( animate );
}

}

我的问题是:是否可以在同一个 Canvas 内绘制多个图表?(我所说的多个并不是说它们会共享轴,我的意思是 Canvas 内有两个完全独立的图表对象)

最佳答案

同一 Canvas 中不能有两个 TChart 对象。其他一些 TeeChart 版本具有允许您执行此操作的 SubChart 工具,但这并未在 TeeChart Javascript 中实现。

在 Teechart Javascript 中,您有两种选择可以实现几乎相同的效果:

  • 有不同的 TChart 对象。参见示例 here .

  • 有一个带有多个自定义轴的 TChart。参见示例 here .在这一个中,请注意您正在手动设置轴的位置,因此如果您愿意,可以在左侧分隔不同的垂直轴。还要注意,在此示例中只有一个水平轴,但您也可以使用与创建垂直轴相同的方式创建多个。

关于javascript - T 形图中同一 Canvas 上的多个图形,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22811466/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com