作者:金婉山_461 | 来源:互联网 | 2023-05-19 00:46
I have a bar chart with 3 series, but I cant change their names, I have only y1 y2 y2, not my own names from the code. As per example bar chartI see, that I should use Multi-columnBarChart, but how can I do that? here is comment from example Multi-columnBarChart:
我有一个有3个系列的条形图,但是我不能改变它们的名字,我只有y1 y2 y2,不是我自己的名字。就像bar chartI看到的,我应该使用多列条形图,但是我怎么做呢?下面是示例多柱条形图的注释:
function multiColumnBarPlotter(e) {
// We need to handle all the series simultaneously.
if (e.seriesIndex !== 0) return;
var g = e.dygraph;
var ctx = e.drawingContext;
var sets = e.allSeriesPoints;
var y_bottom = e.dygraph.toDomYCoord(0);
// Find the minimum separation between x-values.
// This determines the bar width.
var min_sep = Infinity;
for (var j = 0; j
here is my code:
这是我的代码:
function barChartPlotter(e) {
var ctx = e.drawingContext;
var points = e.points;
var y_bottom = e.dygraph.toDomYCoord(0);
// The RGBColorParser class is provided by rgbcolor.js, which is
// packed in with dygraphs.
var color = new RGBColorParser(e.color);
color.r = Math.floor((255 + color.r) / 2);
color.g = Math.floor((255 + color.g) / 2);
color.b = Math.floor((255 + color.b) / 2);
ctx.fillStyle = color.toRGB();
// Find the minimum separation between x-values.
// This determines the bar width.
var min_sep = Infinity;
for (var i = 1; i Point Click " + p.name + ": " + p.xval + "
";
window.open('../RUNNER/_VLOGS/launch' + p.xval + '.html','_blank');
window.open('../RUNNER/_LOGS/launch_log' + p.xval + '.txt','_blank');
},
//drawPoints: true,
//drawXGrid: false,
//drawYGrid: false,
//fillGraph: true
}
);
g.ready(function() {
g.setAnnotations([
{
}]);
});
1 个解决方案
1
For multiple series, you need to get allSeriesPoints
instead of just points
. Here is an example I put together for another SO question:
对于多个级数,您需要获得所有的级数点而不仅仅是点。下面是我为另一个问题整理的一个例子:
Here is a working DEMO at jsFiddle.com
这是jsFiddle.com上的一个工作演示
The plotter code looks like this:
绘图仪代码如下:
function multiColumnBarPlotter(e) {
// We need to handle all the series simultaneously.
if (e.seriesIndex !== 0) return;
var g = e.dygraph;
var ctx = e.drawingContext;
var sets = e.allSeriesPoints;
var y_bottom = e.dygraph.toDomYCoord(0);
// Find the minimum separation between x-values.
// This determines the bar width.
var min_sep = Infinity;
for (var j = 0; j
I then create 2 charts of the same data, one using CSV and the other an array. The CSV provides labels directly in the data, for the array, you can change labels with the labels property:
然后创建两个相同数据的图表,一个使用CSV,另一个使用数组。CSV在数据中直接提供标签,对于数组,您可以使用标签属性更改标签:
labels: ['x', 'series1', 'series2', 'series3'],
The whole chart code would then be
整个图表代码将会是
g2 = new Dygraph(document.getElementById("g_div2"),
theData,
{
// options go here. See http://dygraphs.com/options.html
legend: 'always',
labels: ['x', 'series1', 'series2', 'series3'],
animatedZooms: true,
plotter: multiColumnBarPlotter,
colors: ["#00A0B0", "#6A4A3C", "#CC333F", ],
dateWindow: [0, 8]
});