Javascript 画布中的最近邻插值（internet explorer 9）

借助d3.js（simliar to），我创建了一个简单的图像查看器（带有网格和图像），其中包含一个画布（仅图像）和一些svg网格线。我使用d3.js中的缩放功能来缩放和平移图像/网格线

画布上的图像应使用最近邻插值。为了实现这个目标，我设置了很多风格元素。Chrome和Firefox运行良好，但我在使用InternetExplorer9时遇到了问题（我需要支持ie9）。在IE9中，图像总是模糊的

internet explorer 9是否重复画布的最近邻插值

我的设置正确吗

我在d3.js中的画布代码：

canvas
        .attr("width", dx)
        .attr("height", dy)
        .attr("style", "outline: thin solid black;")
        .style("width", width + "px")
        .style("height", height + "px")
        .style("transform", "translate(" + marginleft + "px,0)")
        .style("image-rendering","-moz-crisp-edges")
        .style("image-rendering","-o-crisp-edges")
        .style("image-rendering","-webkit-optimize-contrast")
        .style("image-rendering","optimize-contrast")
        .style("image-rendering","pixelated")
        .style("-ms-interpolation-mode","nearest-neighbor")
        .call(drawImage);

这个d3.js代码应该（主要）表示这个css

这是我的绘图功能

function drawImage(canvas2: any) {
        var context = canvas.node().getContext("2d");
        var image = context.createImageData(dx, dy);

        for (var y = 0, p = -1; y < dy; ++y) {
            for (var x = 0; x < dx; ++x) {
                let pixval = heatmap[y][x];                                     
                var c = d3.rgb(color(pixval));
                if(pixval <= min){
                    c = d3.rgb(255,255,255);    
                }
                image.data[++p] = c.r;
                image.data[++p] = c.g;
                image.data[++p] = c.b;
                image.data[++p] = 255;
            }
        }

        context.mozImageSmoothingEnabled = false;
        context.ImageSmoothingEnabled = false; //context.webkitImageSmoothingEnabled = false;
        context.msImageSmoothingEnabled = false;
        context.imageSmoothingEnabled = false;

        context.putImageData(image, 0, 0);
        imageObj.src = canvas.node().toDataURL();
    }

函数drawImage（canvas2:any）{
var context=canvas.node（）.getContext（“2d”）；
var image=context.createImageData（dx，dy）；
对于（变量y=0，p=-1；y如果（pixval参见
（强调矿山）

[1] Internet Explorer 7和8支持具有两个值（双三次和最近邻）的非标准-ms插值模式属性：

仅适用于图像（JPG、GIF、PNG等）

在IE7中，仅适用于没有透明度的图像

不继承

默认值IE7：最近邻（低质量）

默认值IE8：双三次（高质量）

从IE9开始过时

看来答案是否定的，IE9不支持它。
谢谢你的回答。这听起来很糟糕。你知道有什么“仿真”库吗？我不知道。你为什么这么需要这个功能？当然，它被标记为过时是有原因的，但我对这个主题还不太熟悉。
function drawImage(canvas2: any) {
        var context = canvas.node().getContext("2d");
        var image = context.createImageData(dx, dy);

        for (var y = 0, p = -1; y < dy; ++y) {
            for (var x = 0; x < dx; ++x) {
                let pixval = heatmap[y][x];                                     
                var c = d3.rgb(color(pixval));
                if(pixval <= min){
                    c = d3.rgb(255,255,255);    
                }
                image.data[++p] = c.r;
                image.data[++p] = c.g;
                image.data[++p] = c.b;
                image.data[++p] = 255;
            }
        }

        context.mozImageSmoothingEnabled = false;
        context.ImageSmoothingEnabled = false; //context.webkitImageSmoothingEnabled = false;
        context.msImageSmoothingEnabled = false;
        context.imageSmoothingEnabled = false;

        context.putImageData(image, 0, 0);
        imageObj.src = canvas.node().toDataURL();
    }