小编Eri*_*yer的帖子

UP-FRONT注意:我没有在这里使用jQuery或其他库,因为我想了解我写的是什么以及为什么它可以工作(或不工作),所以请不要用图书馆的库或插件来回答这个问题.我没有反对库,但对于这个项目,它们对我的编程目标不利.

那说......

在http://meyerweb.com/eric/css/colors/上我添加了一些使用我自己编写的DOM函数的列排序.问题是,虽然它对于字母串字符串的简单情况很有用,但当我尝试对多个数字项进行排序时,结果在浏览器中不一致 - 实际上,当我尝试使用两个子排序进行排序时.

例如,如果您在OS X上的Safari或Firefox中单击"十进制RGB"几次,您将获得我想要的结果.在Chrome或Opera(再次,OS X)中执行相同操作,您会得到截然不同的结果.是的,Safari和Chrome在这里有所不同.

这是我用于RGB排序的JS的片段:

sorter.sort(function(a,b){
    return a.blue - b.blue;
});
sorter.sort(function(a,b){
    return a.green - b.green;
});
sorter.sort(function(a,b){
    return a.red - b.red;
});

(sorter作为我正在尝试排序的数组.)

排序是在另一个StackOverflow问题的传统中完成的" 如何通过JavaScript中的多列对多维数组进行排序？" 及其最佳答案.然而,结果并不是我最初尝试的四种浏览器中的两种.

得到(ha!)得到这与数组排序"不稳定"有关 - 这里没有参数! - 但我不知道的是如何以一致,可靠的方式克服它.我真的可以使用一些帮助来理解问题和看到解决方案,或者至少是解决方案的一般描述.

我意识到可能有六百万种方法来优化JS的其余部分(是的,我使用了全局).我仍然是一个JS新手,并试图通过练习纠正它.现在,它的数组排序让我感到困惑,我可以使用该脚本的一些帮助,然后继续清理其他地方的代码.提前致谢!

UPDATE

除了下面的重要解释和建议外,我还得到了一个更紧凑的解决方案:

function rgbSort(a,b) {
    return (a.red - b.red || a.green - b.green || a.blue - b.blue);
}

即使我还不太了解它,我想我已经开始掌握它的轮廓,这就是我现在正在使用的.感谢大家的帮助!

我试图找出如何从rotate3d()函数转换为等效rotateX() rotateY() rotateZ()函数.沿着素数轴的向量很容易,但我想知道如何对任意向量进行处理.我对矩阵数学没有希望,我意识到这可能是一个障碍,但理想情况下,我最终会得到类似的东西:

• 鉴于rotate3d(x,y,z,a)......
• ...的值由rotateX()[[ as-simple-as-possible equation此处 ]]确定
• ...的值由rotateY()[[ as-simple-as-possible equation此处 ]]确定
• ...的值由rotateZ()[[ as-simple-as-possible equation此处 ]]确定

拥有这些对于构建可视化工具非常有用,可以帮助教授作者如何rotate3d()工作,这是我最终目标的一部分.

(这个问题基本上与rotate3d简写相反[或者它是相反的？] .)

这一切都在 OS X Mojave 上。

我试图阻止自己错误地提交到 master 分支，因为这是我经常做的事情，使用这个 SO answer 中的pre-commitGit 钩子，因为我使用 bash 而不是 sh 稍微改变了。但是，每次我尝试运行它时，都会得到以下信息：

fatal: cannot exec '.git/hooks/pre-commit': Operation not permitted

我检查了.git和.git/hooks目录的权限。两者都是drwxrwxrwx。pre-commit本身的权限是：

-rwxr-xr-x@  1 emeyer  staff    25 Feb  5 11:50 pre-commit

...这与pre-commit.sample我复制到pre-commit然后替换内容的文件相同。我试过了，chmod +w但这并没有解决它。

我决定简化我的测试并替换pre-commit为以下内容：

#!/bin/bash

echo "Test"

我仍然遇到上面提到的Operation not permitted错误。我也在#!/bin/shSO answer's example 中尝试了它；同样的结果。

如果我尝试直接运行脚本，通过./pre-commit从命令行输入，我会得到一个稍微不同的错误：-bash: ./pre-commit: /bin/bash: bad interpreter: Operation not …

我正在尝试使用Perl中的另一个数组来过滤一个术语数组.我在OS X上有Perl 5.18.2,但如果我的行为是相同的use 5.010.这是我的基本设置:

#!/usr/bin/perl
#use strict;
my @terms = ('alpha','beta test','gamma','delta quadrant','epsilon',
             'zeta','eta','theta chi','one iota','kappa');
my @filters = ('beta','gamma','epsilon','iota');
foreach $filter (@filters) {
    for my $ind (0 .. $#terms) {
        if (grep { /$filter/ } $terms[$ind]) {
            splice @terms,$ind,1;
        }
    }
}

这样可以拉出与各种搜索项匹配的行,但数组长度不会改变.如果我写出结果@terms数组,我得到:

[alpha]
[delta quadrant]
[zeta]
[eta]
[theta chi]
[kappa]
[]
[]
[]
[]

正如您可能期望的那样,打印scalar(@terms)得到了结果10.

我想要的是一个长度为6的结果数组,最后没有四个空白项.我如何得到这个结果？为什么阵列不会缩小,因为perldoc页面上splice说"阵列会根据需要增长或缩小".

(我对Perl不是很流利,所以如果你在想"你为什么不......？",几乎可以肯定是因为我听说不知道或不理解它它.)

好吧,所以我在十年前写了这篇文章:

http://meyerweb.com/eric/tools/color-blend/

我很确定它当时工作正常,但从那以后(或者,谁知道,也许总是)一个bug已经悄悄进入.我可以这样证明:

1. 保持'十六进制'.选择几种颜色.混合它们.
2. 使用键盘编辑十六进制颜色(即,键入新的十六进制值,或更改那些值).再次混合.
3. 到现在为止还挺好.
4. 将模式切换为"RGB".
5. 编辑其中一个数字.
6. 现在没有任何作用 - 没有混合,没有类型切换,没有.

为什么？我甚至无法弄清楚它失败的地方.

(是的,我知道JS很笨拙,并使用全局变量和各种ick.我打算重写它.但首先我需要了解这里出了什么问题,如果可能的话我应该如何诊断它我请注意,我几乎不了解如何以非常基本的方式使用Firefox JS调试器.

我在这里可以看到HSL空间中CSS4颜色关键字的分布的SVG可视化：https : //meyerweb.com/eric/css/colors/hsl-dist.html

我最近添加了通过鼠标滚轮缩放和通过鼠标敲击和拖动来平移的功能。我能够从屏幕空间中的点转换为SVG使用的坐标空间matrixTransform，.getScreenCTM()以及.inverse()由于示例代码我在网上找到，但我怎么拖动转换过程中鼠标移动？现在，我只是将viewBox坐标从移X和Y值event，这意味着在放大时图像拖动比鼠标移动快。

举例来说，假设我放大了图像并拖动以平移，并且鼠标向左或向下拉动了一下。 event.movementX返回-37和event.movementY返回6。如何确定SVG坐标等于多少，以便viewBox正确移动坐标？

（注意：我知道有一些类似的库，但是我故意编写香草JS代码以了解有关SVG和JS的更多信息。因此，请不要发布“大声笑，只使用库X ”，然后保留该内容。谢谢！）

编辑添加：我被要求张贴代码。发布整个JS似乎太长了，但这是在mousemove事件上触发的函数：

function dragger(event) {
    var target = document.getElementById('color-wheel');
    var coords = parseViewBox(target);
    coords.x -= event.movementX;
    coords.y -= event.movementY;
    changeViewBox(target,coords);
}

如果需要更多，请在链接页面上查看源代码；所有JS都在页面顶部。除了仅包含可视化的所有HSL值和颜色名称的文件之外，没有任何外部内容。