我在 Y 轴上使用算术(恒定比例)创建了各种图表。现在我想用对数 Y 轴创建一个。
例如:1 和 2 之间的距离应与 2 和 4 相同
关于缩放方法的任何想法
谢谢
我在 Y 轴上使用算术(恒定比例)创建了各种图表。现在我想用对数 Y 轴创建一个。
例如:1 和 2 之间的距离应与 2 和 4 相同
关于缩放方法的任何想法
谢谢
“算术”是指特定的程序或插件吗?否则,如果您只是意味着您有一个 x 和 y 值的列表,那么将 y 值通过一个 log 函数并绘制出来。你用什么语言编程?
嘿对不起,我花了一段时间才回复你。这是您要查找的代码吗?
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Demo</title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
var test = {
x_values: [0,10,20,30,40,50,60,70,80,90,100],
y_values: [0,10,20,30,40,50,60,70,80,90,100],
convert_values_to_log10: function (values) {
var i=0;
var converted_values = []
for (i=0; i<values.length; i++) {
converted_values[i] = Math.log(values[i])/Math.LN10
}
return converted_values;
}
}
$(document).ready(function(){
$('#x_vals').text(test.x_values.toString());
$('#y_vals').text(test.y_values.toString());
$('#y10_vals').text(test.convert_values_to_log10(test.y_values).toString());
});
</script>
</head>
<body>
<h2>x values = </h2>
<p id="x_vals"></p>
<h2>y values = </h2>
<p id="y_vals"></p>
<h2>log10 y values = </h2>
<p id="y10_vals"></p>
</body>
</html>
您可以使用Morris.js来绘制图表。
然后你可以扩展 Morris 并修改 transY 函数来做这样的对数刻度:
(function () {
var $, MyMorris;
MyMorris = window.CbyMorris = {};
$ = jQuery;
MyMorris = Object.create(Morris);
MyMorris.Grid.prototype.gridDefaults["yLogScale"] = false;
MyMorris.Grid.prototype.transY = function (y) {
if (!this.options.horizontal) {
if (this.options.yLogScale) {
return this.bottom - (this.height * Math.log((y + 1) - this.ymin) / Math.log(this.ymax / (this.ymin + 1)));
} else {
return this.bottom - (y - this.ymin) * this.dy;
}
} else {
return this.left + (y - this.ymin) * this.dy;
}
};
}).call(this);
然后yLogScale
在您的 Morris 配置中将参数设置为 true:
yLogScale: true
请参阅我的完整答案以查看结果:https ://stackoverflow.com/a/39878478/1351076