javascript - Web 浏览器中的等高线图

Question

我需要在网络浏览器中绘制等高线图。它也需要是交互式的。有谁知道好的 javascript 库、flash 或 flex 库来做到这一点？

Answer 1

我是一名 Flex 开发人员，所以我至少可以谈谈这个问题的那一部分。据我所见，这在 Flash/Flex 中不存在（至少在任何开放可用的源代码中），并且在很大程度上这个问题太模糊而无法回答，也许链接到一些示例图像，说明你是什么试图创造。通过对等高线图图像进行谷歌搜索，我看到基于不同用途的实现方式多种多样。一般来说，虽然在 Flex 中有一个数据可视化框架，如果您有兴趣在此处查看更多信息，则其中包含一些用于绘制图表的起点：http: //livedocs.adobe.com/flex/3/html/help .html?content=Part7_DataVis_1.html

或者，您可以更多地“从头开始”并使用 Degrafa 作为起点：http ://livedocs.adobe.com/flex/3/html/help.html?content=Part7_DataVis_1.html

或者，如果您对自己的目标有清晰的了解，并且预计图表不会在许多不同的场景中重复使用，那么您可能最好使用 Flash 绘图原语从头开始进行真正的操作走这条路，因为您将对最终产品进行最严格的控制。我这样做是为了构建一个伪 3D 条形图，它实际上比预期的要容易，我还没有，但我会将代码与我在http://www.shaunhusain.com/上制作的其他一些图表一起发布图表（需要重新启动到 linux 才能获得该示例，将在接下来的 4 小时内发布）。

肖恩

Answer 2

情节.js

https://plot.ly/javascript/contour-plots/

https://plot.ly/javascript/reference/#contour

var data = [ {
        z: [[10, 10.625, 12.5, 15.625, 20],
    [5.625, 6.25, 8.125, 11.25, 15.625],
    [2.5, 3.125, 5.0, 8.125, 12.5],
    [0.625, 1.25, 3.125, 6.25, 10.625],
    [0, 0.625, 2.5, 5.625, 10]],
        type: 'contour'
    }
];

var layout = {
  title: 'Basic Contour Plot'
}

Plotly.newPlot('myDiv', data, layout);