标签: linechart
JavaFX LineChart / AreaChart x 轴（CategoryAxis）上的错误排序值
当尝试构建包含可更新的应用程序LineChart或AreaChart我认识到奇怪的行为时 - 可能是由于应用程序逻辑中的错误？
目标是在单击“生成”按钮时将数据填充到图表中或更新图表。用户必须输入图表的开始时间和结束时间，此外还必须选择间隔小时/天/周（通过使用 ）RadioGroup。
初始图表的创建工作没有任何问题。重新生成图表也可以正常工作，但前提是以前的图表中不存在数据点。如果两个图表（旧图表和更新图表）中都包含具有相同 x 值的数据点，则不再按升序排序。
例子：
执行开始日期：01.09.2013 结束日期：25.09.2013 间隔：周
x 轴上的值：
2013年9月1日 / 2013年9月08日 / 2013年9月15日 / 2013年9月22日
单击“天”RadioButton重新生成图表会在 x 轴上生成以下值：
2013年9月1日 / 2013年9月8日 / 2013年9月15日 / 2013年9月22日 / 2013年9月2日 / 2013年9月03日 / 2013年9月04日 / ...
（值应为 01.09.2013 / 02.09.2013 / 03.09.2013 / ...）
已在第一个图表中显示且也在第二个图表中显示的所有值均在新图表的开头排序（而不是按升序排列）
这是实现这一技巧的代码（方法代码initializeTimeline仅用于测试目的（肯定有点可优化；）））：
public class ChartDesignController implements Initializable {
@FXML
private AreaChart chartOne;
@FXML
private TextField startDate;
@FXML
private TextField endDate;
@FXML
private RadioButton …推荐指数
解决办法
查看次数
MPAndroidChart：LineChart 填充不会在 XAxis 处停止
我正在使用MPAndroidChart。当我使用 LineChart setDrawFilled() 方法填充线条和 x 轴之间的空间，并手动将范围调整为大于默认值时，填充的部分将超出 x 轴，如下所示截屏：
蓝色填充应在绿色虚线处停止，该线位于 x 轴上方，但它会延伸至正 y 值。
*经过进一步调查，我发现似乎只有在绿线设置为 0 时才会发生。
推荐指数
解决办法
查看次数
如何在 MPAndroidChart 中持续更新 Y 轴值
我希望 LineChart 中的轴实时调整它的最大值和最小值。当新数据的 Y 值增加（正值和负值）时，resetAxisMaxValue() 和 resetAxisMinValue() 等函数运行良好，但是，一旦信号再次变低，Y 值 max 和 min 永远不会下降到较小的值，因此它可以显示图表完整画布上的所有新数据。我想检查是否有方法可以自动执行此操作，或者是否应该使用蛮力。谢谢你。
推荐指数
解决办法
查看次数
谷歌图表在材料中的图例页面
我希望在新的 google chars API 上获得图例分页。我以前看到它是可能的，但现在找不到任何文档。
如果不再可能，我怎样才能让我的折线图图例扩展图表 div？
我将 div 设置为 min-height: 400px 并且它强制 SVG 为 400px 并且不调整 div 的大小。
我制作了这个超级快速的演示，展示了 35 个图例，您可以看到它是如何将它们切断的。我要么希望它允许一些分页，要么根据需要扩展图表的大小，或者显示第二列图例。
https://jsfiddle.net/4y800onc/
如果您切换到经典模式，您会看到它尝试了一个非常奇怪的水平图例分页。不幸的是我无法切换到经典模式（我的应用程序依赖于材料模式）
google.charts.load('current', {
'packages': ['line', 'corechart']
});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var button = document.getElementById('change-chart');
var chartDiv = document.getElementById('chart_div');
var data = new google.visualization.DataTable();
data.addColumn('date', 'Month');
data.addColumn('number', "Average Temperature");
data.addColumn('number', "Average Hours of Daylight");
data.addColumn('number', "Average Hours of Daylight");
data.addColumn('number', "Average Hours of Daylight");
data.addColumn('number', "Average Hours of Daylight");
data.addColumn('number', "Average Hours of Daylight");
data.addColumn('number', "Average Hours …推荐指数
解决办法
查看次数
D3 - 向简单折线图添加网格
在下面的简单折线图中，我想在 x 和 y 轴上添加网格。有人可以帮助我吗？
片段：
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.12/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/4.3.0/d3.min.js"></script>
</head>
<body ng-app="myApp" ng-controller="myCtrl">
<svg></svg>
<script>
//module declaration
var app = angular.module('myApp',[]);
//Controller declaration
app.controller('myCtrl',function($scope){
$scope.svgWidth = 800;//svg Width
$scope.svgHeight = 500;//svg Height
//Data in proper format
var data = [
{"letter": "A","frequency": "5.01"},
{"letter": "B","frequency": "7.80"},
{"letter": "C","frequency": "15.35"},
{"letter": "D","frequency": "22.70"},
{"letter": "E","frequency": "34.25"},
{"letter": "F","frequency": "10.21"},
{"letter": "G","frequency": "7.68"},
];
//removing prior svg elements ie clean up svg
d3.select('svg').selectAll("*").remove();
//resetting svg height and …推荐指数
解决办法
查看次数
MPAndroidChart：带有三次贝塞尔曲线的 LineChart 显示错误（尖峰和循环）
我正在尝试使用立方图制作 LineChart。结果如下面的截图所示：三次贝塞尔曲线显示错误并有“尖峰”。有人可以帮我让它正确显示吗？
这是我的配置：
LineDataSet lineDataSet = new LineDataSet(entries,nameLabel);
lineDataSet.setColor(Constants.colors.get(i));
lineDataSet.setDrawValues(false);
lineDataSet.setDrawCircles(false);
lineDataSet.setMode(LineDataSet.Mode.CUBIC_BEZIER);
谢谢
推荐指数
解决办法
查看次数
Google 可视化折线图 - 多条线
我有一个折线图，h 轴是日期，v 轴是双精度。我需要显示两行：
lineA: [
[2016-1-1 00:00, 1.1]
[2016-2-1 00:00, 1.1]
[2016-3-1 00:00, 1.1]
]
lineB: [
[2016-1-1 00:00, 2.1]
[2016-2-1 08:00, 2.1]
[2016-3-1 00:00, 2.1]
]
为了在图表上显示数据，我需要组合这两行并将结果传递给 arrayToDataTable。
combine: [
[2016-1-1 00:00, 1.1, 2.1],
[2016-2-1 00:00, 1.1, null],
[2016-2-1 08:00, null, 2.1],
[2016-3-1 00:00, 1.1, 2.1],
]
由于上述原因，我的线条出现了间隙。我该如何解决这个问题？是否可以通过两组单独的组，每行一组？我找到的所有示例都需要将它们合并为表格combine。
作为 line1 和 line2 表的一部分提供时，我需要保留空值
推荐指数
解决办法
查看次数
在 >4.x Plotly 中排列线图的路径顺序
我需要绘制一条路径，该路径并不严格从左到右，而是在 y 轴上交叉，但是自从我升级到plotly 4.7以来，我不能不这样做。fx 没问题。3.6
有谁知道如何以情节方式告诉路径如何排序？
library(dplyr)
library(plotly) # > 4.x
data.frame(x = c(1:5,5:1),y = c(1:10)) %>%
arrange(y) %>%
plot_ly(x = ~x,y = ~y) %>% add_lines()
如果你查看 data.frame 它应该遵循红色路径：
data.frame(x = c(1:5,5:1),y = c(1:10)) %>% arrange(y)
x y
1 1 1
2 2 2
3 3 3
4 4 4
5 5 5
6 5 6
7 4 7
8 3 8
9 2 9
10 1 10
推荐指数
解决办法
查看次数
MPAndroidChart - getFormattedValue 方法中的值错误。他们来自哪里？
我正在处理一个使用 MPAndroidChart 库的项目，这让我非常抓狂，我想删除它。
问题是我创建了一个自定义的 ValueFormatter，我无法理解这些值的来源，都是错误的。
private void setData() {
for (int i = 1; i <= 10; i++) {
Entry entry = new Entry(i, i);
values.add(entry);
}
IAxisValueFormatter valueFormatter = new myValueFormatter();
XAxis xAxis = mChart.getXAxis();
xAxis.setValueFormatter(valueFormatter);
LineDataSet set1 = new LineDataSet(values, "DataSet 1");
ArrayList<ILineDataSet> dataSets = new ArrayList<ILineDataSet>();
dataSets.add(set1); // add the datasets
// create a data object with the datasets
LineData data = new LineData(dataSets);
// set data
mChart.setData(data);
}
自定义格式化程序类： 我有一个数组，它有 1、2、3、4、5、6、7、8、9、10 个值，但在 getFormattedValue 方法中得到 2、4、6、8、10 个值。 …
推荐指数
解决办法
查看次数
Chart.js - 折线图最右边的数据点截止
使用 Chart.js 版本 2.8.0 绘制基本折线图。\n观察最右边的数据点被切断。但最左边的数据点（第一个数据点）看起来完好无损。\n
I\xe2\x80\x99通过更改 pointRadius 的值来更改数据点圆的大小。但即使是最小值，数据点仍然会被切断。
\n\n我\xe2\x80\x99m 没有使用任何插件或奇特的设置。我用浅灰色背景色填充图表。但除此之外，其他一切都是一个盒子标准 Chart.js。
\n\n我\xe2\x80\x99ve在这里重新创建了这个问题：\n https://codepen.io/LeoU/pen/gVLybO
\n\n这是我的选项设置。
\n\noptions: {\n legend: {\n display: false,\n },\n tooltips: {\n callbacks: {\n label: function (tooltipItem, data) {\n var tooltipValue = data.datasets[tooltipItem.datasetIndex].data[tooltipItem.index];\n return "\xc2\xa3" + parseInt(tooltipValue).toLocaleString();\n }\n }\n }, \n scales: {\n yAxes: [{ \n gridLines: {\n color: "white",\n lineWidth: 2\n },\n ticks: {\n beginAtZero: true,\n min: 0,\n stepSize: 500000,\n callback: function(value, index, values) {\n return "\xc2\xa3" + value.toLocaleString();\n },\n },\n scaleLabel: {\n …推荐指数
解决办法
查看次数