2016-10-30 1 views
0

투명도를 내 CanvasJS 배경에 추가하려고합니다. CanvasJS는 backgroundColor를 사용하여 캔버스의 배경색을 선택합니다.CanvasJS 투명 배경

색상 코드 대신 "없음"이라고 쓰려고했지만 검정색 배경이되었습니다.

또한 배경에 대해 다른 불투명도를 선택할 수있는 것이 좋습니다.

답변

3

투명 배경을 설정하려면 backgroundColor : "transparent"를 설정할 수 있습니다. 그리고 어떤 색상에 투명성을 부여하려면 rgba 색상 코딩을 사용할 수 있습니다 (예 : backgroundColor : "rgba (225,150,150,0.5)").

1

background-color: transparent;을 설정할 수 있으며 색상이 표시되지 않습니다.

불투명도는 rgba를 사용하여 설정할 수 있습니다. 화이트 50 %의 경우, background-color: rgba(255, 255, 255, .5);

나는 Canvas를 사용한 적이 없으며 그 스크립트가 어떤 영향을 줄지는 모르지만 기본 CSS에서는 트릭을 수행 할 것입니다. http://jsfiddle.net/canvasjs/7b0xdcwv/

0
<br/><!-- Just so that JSFiddle's Result label doesn't overlap the Chart --> 
<div id="chartContainer" style="height: 300px; width: 100%;"></div> 

전체 데모 나는 결국 답을 발견했다. 빈 문자열 (backgroundColor : '')로 backgroundColor를 가질 수 있으며, 배경색을 생략하고 투명하게 남겨 둡니다.

투명도를 색상에 추가 할 수 있는지 알고 싶습니다. 누구든지 알고있는 경우 댓글을 달아주세요.

0

0

Canvasjs document에 따르면 당신은 배경 색상, 사용 RGBA 설정할 수 있습니다 (0, 0, 0, 0) 투명을 위해 (물론 당신은 당신의 목적을 해결하기 위해 내부 값을 변경할 수 있습니다) :

window.onload = function() { 
    var chart = new CanvasJS.Chart("chartContainer", 
    { 
     title:{ 
     text: "Title with Background Color", 
     padding: 5, 
     backgroundColor: rgba(0, 0, 0, 0), 
     }, 
     data: [ 
     { 
     type: "column", 
     dataPoints: [ 
     { x: 10, y: 71 }, 
     ] 
     } 
     ] 
    }); 

    chart.render(); 
    } 

희망 도움말 :