jjzjj

javascript - 在 d3.js v4 中创建 asinh(反双曲正弦)标度

coder 2024-05-16 原文

这将替代对数刻度，以便它可以处理负数。虽然我一直在尝试使用 d3 的对数刻度源作为起点，但还没有看到很多自定义刻度的例子。

最佳答案

据我所知，没有办法在 D3 中制作自定义比例(至少不是您正在寻找的那种感觉)。所有 D3 尺度都分两步缩放:

  1. 使用域，在给定反插值函数的情况下对输入进行反插值
  2. 使用范围，对步骤1的中间结果进行插值以获得输出

我相信您的理想答案基本上可以回答这个问题，“如何将 D3 刻度的去插值函数设置为自定义函数？”，我认为目前这不可能。

但是，您可以设置插值功能。 Mike Bostock 的这个示例展示了如何使用 D3 的内置缓动函数之一设置插值: http://bl.ocks.org/mbostock/56ea94205411ee9e4dbec3742f7ad08c

该示例具有“鱼眼镜头”效果，这可能与您想要的相反。您可以使用指数小于 1 的多项式缓动函数 d3.easePolyInOut 来获得更接近对数缩放的值(请参阅我的代码片段)。不幸的是，没有“logInOut”或“asinhInOut”，因此如果您需要更陡峭的滚降(比多项式)，那么您将不得不编写自己的缓动/插值函数。

var data = Array.from(Array(21), (_,i)=>{return 10*(i-10)})

var svg = d3.select("svg"),
    margin = {top: 50, right: 20, bottom: 5, left: 20},
    width = svg.attr("width") - margin.left - margin.right,
    height = svg.attr("height") - margin.top - margin.bottom,
    g = svg.append("g").attr("transform", "translate(" + margin.left + "," + margin.top + ")");

var polyexp = 0.25

var x = d3.scaleLinear()
    .domain([-100,100])
    .range([0, width])
    .interpolate(easeInterpolate(d3.easePolyInOut.exponent(polyexp)));

g.append("g")
    .attr("class", "axis axis--x")
    .call(d3.axisBottom(x));

g.selectAll("circle").data(data).enter().append("circle")
  .attr("cx", (d) => x(d))
  .attr("cy", -10)
  .attr("r", 3)
  .attr("fill", "steelblue")

function easeInterpolate(ease) {
  return function(a, b) {
    var i = d3.interpolate(a, b);
    return function(t) {
      return i(ease(t));
    };
  };
}
.axis text {
  font: 10px sans-serif;
}

.axis path,
.axis line {
  fill: none;
  stroke: #000;
  shape-rendering: crispEdges;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/4.3.0/d3.js"></script>
<svg width="600" height="100"></svg>

关于javascript - 在 d3.js v4 中创建 asinh(反双曲正弦)标度，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/40541780/

中创双曲34sectioncodejavascriptmathd3.jschartsvisualization

有关javascript - 在 d3.js v4 中创建 asinh(反双曲正弦)标度的更多相关文章

  1. ruby-on-rails - Rails - 从另一个模型中创建一个模型的实例 - 2

    我有一个正在构建的应用程序，我需要一个模型来创建另一个模型的实例。我希望每辆车都有4个轮胎。汽车模型classCar轮胎模型classTire但是，在make_tires内部有一个错误，如果我为Tire尝试它，则没有用于创建或新建的activerecord方法。当我检查轮胎时，它没有这些方法。我该如何补救？错误是这样的:未定义的方法'create'forActiveRecord::AttributeMethods::Serialization::Tire::Module我测试了两个环境:测试和开发，它们都因相同的错误而失败。 最佳答案

  2. ruby - 如何在 Ruby 中创建无类 DSL？ - 2

    我正在尝试找出如何为我的Ruby项目创建一种“无类DSL”，类似于在Cucumber步骤定义文件中定义步骤定义或在Sinatra应用程序中定义路由。例如，我想要一个文件，其中调用了我的所有DSL函数:#sample.rbwhen_string_matches/hello(.+)/do|name|call_another_method(name)end我认为用我的项目特有的一堆方法污染全局(内核)命名空间是一种不好的做法。因此方法when_string_matches和call_another_method将在我的库中定义，并且sample.rb文件将以某种方式在我的DSL方法的上下文中

  3. ruby-on-rails - 如何在 Rails 3 中创建自定义脚手架生成器？ - 2

    有这些railscast。http://railscasts.com/episodes/218-making-generators-in-rails-3有了这个，你就会知道如何创建样式表和脚手架生成器。http://railscasts.com/episodes/216-generators-in-rails-3通过这个，您可以了解如何添加一些文件来修改脚手架View。我想把两者结合起来。我想创建一个生成器，它也可以创建脚手架View。有点像RyanBates漂亮的生成器或web_app_themegem(https://github.com/pilu/web-app-theme)。我

  4. ruby - 为什么在 ruby​​ 中创建 Rational 不需要新方法 - 2

    这个问题在这里已经有了答案:关闭10年前。PossibleDuplicate:Rubysyntaxquestion:Rational(a,b)andRational.new!(a,b)我正在阅读ruby镐书，我对创建有理数的语法感到困惑。Rational(3,4)*Rational(1,2)产生=>3/8为什么Rational不需要new方法(我还注意到例如我可以在没有new方法的情况下创建字符串)？

  5. ruby - 在 Ruby 中创建按公共(public)键值分组的新哈希 - 2

    假设我有一个在Ruby中看起来像这样的哈希:{:ie0=>"Hi",:ex0=>"Hey",:eg0=>"Howdy",:ie1=>"Hello",:ex1=>"Greetings",:eg1=>"Goodday"}有什么好的方法可以将它变成如下内容:{"0"=>{"ie"=>"Hi","ex"=>"Hey","eg"=>"Howdy"},"1"=>{"ie"=>"Hello","ex"=>"Greetings","eg"=>"Goodday"}} 最佳答案 您要求一个好的方法来做到这一点，所以答案是:一种您或同事可以在六个月后理解

  6. ruby-on-rails - 使用 javascript 更改数据方法不会更改 ajax 调用用户的什么方法？ - 2

    我遇到了一个非常奇怪的问题，我很难解决。在我看来，我有一个与data-remote="true"和data-method="delete"的链接。当我单击该链接时，我可以看到对我的Rails服务器的DELETE请求。返回的JS代码会更改此链接的属性，其中包括href和data-method。再次单击此链接后，我的服务器收到了对新href的请求，但使用的是旧的data-method，即使我已将其从DELETE到POST(它仍然发送一个DELETE请求)。但是，如果我刷新页面，HTML与"new"HTML相同(随返回的JS发生变化)，但它实际上发送了正确的请求类型。这就是这个问题令我困惑的

  7. ruby - 在 Mechanize 中使用 JavaScript 单击链接 - 2

    我有这个:AccountSummary我想单击该链接，但在使用link_to时出现错误。我试过:bot.click(page.link_with(:href=>/menu_home/))bot.click(page.link_with(:class=>'top_level_active'))bot.click(page.link_with(:href=>/AccountSummary/))我得到的错误是:NoMethodError:nil:NilClass的未定义方法“[]” 最佳答案 那是一个javascript链接。Mechan

  8. ruby-on-rails - 在 Rails 中创建自定义方法 - 2

    我正在尝试找到解决此问题的好方法。假设我有一个包含帖子、标题和不同状态ID的表格。在我的Controller索引中，我有:@posts=Post.all然后在我的模型中我有:defcheck_status(posts)posts.eachdo|post|#logichereendend所以在我的Controller中我有:@posts.check_status(@posts)但我在加载索引时遇到以下错误:undefinedmethodcheck_statusfor有什么想法吗？ 最佳答案 它应该是一个类方法，以self.为前缀:de

  9. ruby-on-rails - 为什么我不能在 Rails 的表格中创建一个数组作为列？ - 2

    为什么我不能这样做:classCreateModels是否有其他方法可以使数组(“apples”)成为Fruit类实例的属性？ 最佳答案 在Rails4中并使用PostgreSQL，您实际上可以在数据库中使用数组类型:迁移:classCreateSomething 关于ruby-on-rails-为什么我不能在Rails的表格中创建一个数组作为列？，我们在StackOverflow上找到一个类似的问题： https://stackoverflow.com/qu

  10. ruby-on-rails - 如何在 Rails 5 中创建 ActiveRecord 无表模型？ - 2

    我尝试创建新模型，该模型在数据库中没有表的情况下具有自动类型转换。我试图从ActiveRecord::Base继承它抛出异常ActiveRecord::StatementInvalid:PG::UndefinedTable:ERROR:relation"people"doesnotexist类实现:classPerson堆栈跟踪:ActiveRecord::StatementInvalid:PG::UndefinedTable:ERROR:relation"people"doesnotexistLINE8:WHEREa.attrelid='"people"'::regclass^:SE

随机推荐