Образец штриховки не работает на iOS с D3 js v5 - PullRequest
Новая
       22

Образец штриховки не работает на iOS с D3 js v5

0 голосов
/ 05 мая 2020

Мне нужна помощь по шаблону на D3 js v5. Я хочу заполнить прямоугольник диагональной штриховкой, он отлично работает на Android, но не на iOS.

Я использую Ioni c 5 с кордовой.

Фактически Результат на iOS: черный прямоугольник

Вот что я делаю: 

this.svg = d3.select('#timeline');
this.svg.append('defs').append('pattern')
    .attr('id', 'diagonalHatch')
    .attr('patternUnits', 'userSpaceOnUse')
    .attr('width', 4)
    .attr('height', 4)
    .append('path')
    .attr('d', 'M-1,1 l2,-2 M0,4 l4,-4 M3,5 l2,-2')
    .attr('stroke', 'red')
    .attr('stroke-width', 1);

this.rect = this.g.selectAll('rect')
    .data(data)
    .enter()
    .append('rect')
    .attrs({ 
        x: (d) => { return this.x(new Date(d.startTime)) },
        y: (d) => { return this.y(d.task) },
        width: (d) => { return this.x(new Date(d.endTime)) - this.x(new Date(d.startTime)) },
        height: yTicksSpacing,
        fill: (d) => { return d.task == "Waiting" ? 'url(#diagonalHatch)' : d.color }
    }).on('click', (d, i, targetElement) => {
        d3.select("#tooltip").selectAll("*").remove();
        this.showTooltip(d,targetElement[i]);
    });
...