d3 js 막 대형 차트가 모질라 파이어 폭에서 작동하지 않습니다.

나는 jsfiddle 링크를 참조하여 d3 js 막 대형 차트를 구현했습니다. chrome.In에서 잘 작동하는 Firefox 웹 브라우저 태그가 숨겨져 있습니다.d3 js 막 대형 차트가 모질라 파이어 폭에서 작동하지 않습니다.

<body> <h1>D3.js Bar Chart Demo</h1> <p> 
    Click on the bar to delete it. </p> <div> 
    <button onclick="changeData()">New</button> 
    <button onclick="appendData()">Append</button> 
    <button onclick="sortData()">Sort</button> </div> <svg id="chart"></svg> <p> 
    Click on the bar to delete it. </p> <div> 
    <button onclick="changeData()">New</button> 
    <button onclick="appendData()">Append</button> 
    <button onclick="sortData()">Sort</button> </div> <div class="trans-fore"> 
    <div id="tooltip"></div> </div> </body>

출처

2017-12-05 akhil viswam

문제의 범위는 clipPath입니다. Chrome은 요소 선언에 대해서는 상당히 관대하지만 Firefox는 허용하지 않습니다.

svg.append('clippath') 
    .attr('id', 'chart-area') 
    .append('rect') 
    .attr({ 
    x: Chart.margin.left + Chart.sideWidth, 
    y: Chart.margin.top, 
    width: BarArea.width, 
    height: BarArea.height, 
});

사람 : : 여기

svg.append('defs').append('clipPath') 
    .attr('id', 'chart-area') 
    .append('rect') 
    .attr({ 
    x: Chart.margin.left + Chart.sideWidth, 
    y: Chart.margin.top, 
    width: BarArea.width, 
    height: BarArea.height, 
});

이 작업 fiddle입니다 은 바이올린 가공, 변화를 얻으려면.

출처

2017-12-05 08:10:43 JulCh

d3 js 막 대형 차트가 모질라 파이어 폭에서 작동하지 않습니다.

답변

관련 문제