Nền tùy chọn biểu đồ Highcharts Màu sắc: 'trong suốt' hiển thị màu đen trên IE 8

81

Highchartstùy chọn biểu đồ backgroundColor:'transparent'hiển thị màu đen trênIE 8

histogram = new Highcharts.Chart({
            chart: { renderTo: 'histogram', defaultSeriesType: 'bar',
                     backgroundColor:'transparent'
            }

Điều này hoạt động tốt trên I.E 9và những người khác nhưng không thành công trên IE 8 và Safari. Bất kỳ ai có ý kiến tại sao không?

— Nikshep
nguồn

128

Hãy thử giải pháp này:

histogram = new Highcharts.Chart({
                chart: { renderTo: 'histogram', defaultSeriesType: 'bar',
                         backgroundColor:'rgba(255, 255, 255, 0.0)'
                }

— Mayuresh
nguồn

Không hoàn toàn minh bạch. Hộp được nhìn thấy rõ ràng. Câu trả lời của nessa.gp phù hợp với tôi.

— Adrian Bartholomew

26

Đó là một cách giải quyết. Hoạt động tốt hơn với backgroundColor:null.

— ViniciusPires

Cảm ơn bạn đã giúp đỡ của bạn :)

— russellhoff

3

backgroundColor: 'rgba (255, 255, 255, 0.0)' sẽ cung cấp cho bạn sự minh bạch hoàn toàn

— neo

2

Null không còn hoạt động trong HighCharts 6. Thay vào đó, hãy sử dụng backgroundColor: 'trong suốt'. (Đã thử nghiệm trên tất cả các trình duyệt hiện đại và IE11 +).

— Stevethemacguy

132

Bạn có thể thử cái này -

backgroundColor: null

Xem trên: jsfiddle

— Bhesh Gurung
nguồn

7

Câu trả lời của Mayuresh đó là một giải pháp thay thế tốt nhưng điều này cũng hoạt động và trông sạch sẽ hơn.

— Capy

4

Hoàn hảo! Nếu tôi chỉ có 10 phiếu ủng hộ để đưa ra :) Đây chắc chắn là giải pháp chính xác, thanh lịch, không-phải-hack.

— Kato

4

Tôi đồng ý; đây có lẽ nên là câu trả lời hàng đầu.

— Geoff

Công việc khó khăn của bạn hiện đã bị hỏng vì Highcharts đã di chuyển tệp .js mà bạn đã liên kết đến. Như đã đề cập ở những nơi khác, null sẽ không luôn hoạt động. Câu trả lời của nessa.gp đưa ra các giá trị trường hợp tốt nhất cho từng trình duyệt, như được phát hiện bởi chính Highcharts.

— Colt McCormack

nó cũng khắc phục sự cố whkhtmltopdf với nền đen.

— Rostyslav Diachok

9

Tôi tìm thấy điều này trong các nguồn Highcharts:

Độ mờ thấp nhất có thể có theo kinh nghiệm cho TRACKER_FILL

IE6: 0,002

IE7: 0,002

IE8: 0,002

IE9: 0,00000000001 (không giới hạn)

IE10: 0,0001 (chỉ xuất)

FF: 0,00000000001 (không giới hạn)

Chrome: 0,000001

Safari: 0,000001

Opera: 0,00000000001 (không giới hạn)

TRACKER_FILL = 'rgba (192,192,192,' + (hasSVG? 0,0001: 0,002) + ')'

Vì vậy, bạn có thể đặt màu nền biểu đồ thành 'rgba (255,255,255,0.002)' và nó chạy trong các trình duyệt quan trọng nhất.

— nessa.gp
nguồn

2

backgroundColor: 'transparent' cũng hoạt động nếu bạn cần loại an toàn.

— Attila Csányi
nguồn

0

Nếu bạn có thể truy cập tệp highcharts.js, hãy chuyển đến dòng backgroundColor (khoảng 479) và thay đổi dòng như thế backgroundColor:"rgba(255, 255, 255, 0)". Nó sẽ thay đổi tất cả các nền của biểu đồ thành trong suốt

— GrooveNow
nguồn

1

Và sau đó bạn sẽ phải làm điều đó mỗi khi bạn cập nhật thư viện.

— guioconnor

-2

Có thể bạn phải viết

filter:0 !important;

trong css của bạn.

— sandeep
nguồn

-2

backgroundColor:'rgba(255, 255, 255, 0.0)',

— Pankaj Upadhyay
nguồn

1

Mặc dù đoạn mã này có thể giải quyết câu hỏi, bao gồm một lời giải thích thực sự giúp cải thiện chất lượng bài đăng của bạn. Hãy nhớ rằng bạn đang trả lời câu hỏi cho người đọc trong tương lai và những người đó có thể không biết lý do cho đề xuất mã của bạn.

— Clijsters