Google 타임 라인 차트의 모든 막대에 색상을 지정하는 방법은 무엇입니까?

루낙자인

여기에서 다른 답변을 읽고 그에 따라 role속성을 추가 했지만 작동하지 않았습니다.

<Chart
  width={'500px'}
  height={'300px'}
  chartType="Timeline"
  loader={<div>Loading Chart</div>}
  data={[
    [
      { type: 'string', id: 'President' },
      { type: 'date', id: 'Start' },
      { type: 'date', id: 'End' },
      {type: 'string', role: 'style'}
    ],
    ['Washington', new Date(1789, 3, 30), new Date(1797, 2, 4), 'gold'],
    ['Adams', new Date(1797, 2, 4), new Date(1801, 2, 4), 'color: #ccc'],
    ['Jefferson', new Date(1801, 2, 4), new Date(1809, 2, 4), 'gold'],
  ]}
  options={{
    showRowNumber: true,
  }}
  rootProps={{ 'data-testid': '1' }}
/>

참조 : https://react-google-charts.com/timeline-chart

하얀 모자

타임 라인 차트에서 스타일 역할은 세 번째 열로 사용될 때만 작동합니다.

따라서 막대 레이블에 대한 두 번째 열도 추가해야합니다.
하지만 null필요한 경우 해당 열의 값을 사용할 수 있습니다 .

<Chart
  width={'500px'}
  height={'300px'}
  chartType="Timeline"
  loader={<div>Loading Chart</div>}
  data={[
    [
      { type: 'string', id: 'President' },
      { type: 'string', id: 'Bar' },        // <-- add bar label here...
      { type: 'string', role: 'style' },    // <-- add style role here...
      { type: 'date', id: 'Start' },
      { type: 'date', id: 'End' }
    ],
    ['Washington', null, 'gold', new Date(1789, 3, 30), new Date(1797, 2, 4)],
    ['Adams', null, '#ccc', new Date(1797, 2, 4), new Date(1801, 2, 4)],
    ['Jefferson', null, 'gold', new Date(1801, 2, 4), new Date(1809, 2, 4)],
  ]}
  options={{
    showRowNumber: true,
  }}
  rootProps={{ 'data-testid': '1' }}
/>

이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.

침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제

에서 수정
0

몇 마디 만하겠습니다

0리뷰
로그인참여 후 검토

관련 기사

분류에서Dev

Google 타임 라인 차트 막대에 특정 색상을 지정하고 다른 색상은 '기본'모듬 색상으로 만듭니다.

분류에서Dev

angular-google-charts의 타임 라인 차트에 '툴팁'을 추가하는 방법은 무엇입니까?

분류에서Dev

Google 라인 차트에 RGBA 색상을 추가하는 방법은 무엇입니까?

분류에서Dev

Plotly : Gantt / 타임 라인 다이어그램에서 정의 된 색상 막대를 얻는 방법은 무엇입니까?

분류에서Dev

Google 스크립트를 사용하여 스프레드 시트의 모든 막대 차트 제목을 수정하는 방법은 무엇입니까?

분류에서Dev

Google 차트의 타임 라인이 색상을 인식하지 못합니다.

분류에서Dev

Google 드라이브의 모든 상위 폴더 이름을 인쇄하는 방법은 무엇입니까?

분류에서Dev

타임 라인을 따라 이벤트에 대한 시각화를 만드는 방법은 무엇입니까?

분류에서Dev

vim 라인 모드에서 블록의 모든 라인을 표시하는 방법은 무엇입니까?

분류에서Dev

Flutter에서 이벤트의 타임 라인 목록을 저장하는 방법은 무엇입니까?

분류에서Dev

간단한 Google 라인 차트에서 다른 값 범위에 대해 다른 색상을 사용하는 방법은 무엇입니까?

분류에서Dev

asp.Net MVC 차트의 각 막대에 색상을 설정하는 방법은 무엇입니까?

분류에서Dev

React의 모든 <li>와 반대로 개별 <li> 스타일을 지정하는 방법은 무엇입니까?

분류에서Dev

Plotly : 누적 막대 차트에서 색상을 사용자 지정하는 방법은 무엇입니까?

분류에서Dev

Google Charts API에서 누적 막대 차트의 섹션 색상을 변경하는 방법은 무엇입니까?

분류에서Dev

PHP의 지정된 색인에서 이전 모든 요소를 삭제하는 방법은 무엇입니까?

분류에서Dev

Tkinter 캔버스에서 닫힌 폴리 라인의 색상을 지정하는 방법은 무엇입니까?

분류에서Dev

조건에 따라 데이터 프레임의 모든 열을 곱하는 방법은 무엇입니까?

분류에서Dev

AMP 페이지에서 인라인 스타일을 재정의하는 방법은 무엇입니까?

분류에서Dev

PDF 파일의 모든 하이라이트 색상을 변경하는 방법은 무엇입니까?

분류에서Dev

amCharts 라인 차트에서 범주 축의 날짜 형식을 지정하는 방법은 무엇입니까?

분류에서Dev

디자인 타임에 내 usercontrol을 사용하여 컨트롤을 부모 양식으로 정의하는 방법은 무엇입니까?

분류에서Dev

Google 막대 차트 라벨링 동적 데이터. 라벨을 추가하는 방법은 무엇입니까?

분류에서Dev

모든 브라우저에서 모든 웹 페이지의 흰색 배경을 수정하는 방법은 무엇입니까?

분류에서Dev

모든 브라우저에서 모든 웹 페이지의 흰색 배경을 수정하는 방법은 무엇입니까?

분류에서Dev

Highcharts 폴라 차트에서 막대 사이의 빈 공간을 제거하는 방법은 무엇입니까?

분류에서Dev

Swift 2에서 임의의 색상에 대한 타이머를 설정하는 방법은 무엇입니까?

분류에서Dev

차트 js 막대 차트 모양을 사용자 지정하는 방법은 무엇입니까?

분류에서Dev

대상에 따라 WPF 컨트롤의 스타일을 설정하는 방법은 무엇입니까?

Related 관련 기사

  1. 1

    Google 타임 라인 차트 막대에 특정 색상을 지정하고 다른 색상은 '기본'모듬 색상으로 만듭니다.

  2. 2

    angular-google-charts의 타임 라인 차트에 '툴팁'을 추가하는 방법은 무엇입니까?

  3. 3

    Google 라인 차트에 RGBA 색상을 추가하는 방법은 무엇입니까?

  4. 4

    Plotly : Gantt / 타임 라인 다이어그램에서 정의 된 색상 막대를 얻는 방법은 무엇입니까?

  5. 5

    Google 스크립트를 사용하여 스프레드 시트의 모든 막대 차트 제목을 수정하는 방법은 무엇입니까?

  6. 6

    Google 차트의 타임 라인이 색상을 인식하지 못합니다.

  7. 7

    Google 드라이브의 모든 상위 폴더 이름을 인쇄하는 방법은 무엇입니까?

  8. 8

    타임 라인을 따라 이벤트에 대한 시각화를 만드는 방법은 무엇입니까?

  9. 9

    vim 라인 모드에서 블록의 모든 라인을 표시하는 방법은 무엇입니까?

  10. 10

    Flutter에서 이벤트의 타임 라인 목록을 저장하는 방법은 무엇입니까?

  11. 11

    간단한 Google 라인 차트에서 다른 값 범위에 대해 다른 색상을 사용하는 방법은 무엇입니까?

  12. 12

    asp.Net MVC 차트의 각 막대에 색상을 설정하는 방법은 무엇입니까?

  13. 13

    React의 모든 <li>와 반대로 개별 <li> 스타일을 지정하는 방법은 무엇입니까?

  14. 14

    Plotly : 누적 막대 차트에서 색상을 사용자 지정하는 방법은 무엇입니까?

  15. 15

    Google Charts API에서 누적 막대 차트의 섹션 색상을 변경하는 방법은 무엇입니까?

  16. 16

    PHP의 지정된 색인에서 이전 모든 요소를 삭제하는 방법은 무엇입니까?

  17. 17

    Tkinter 캔버스에서 닫힌 폴리 라인의 색상을 지정하는 방법은 무엇입니까?

  18. 18

    조건에 따라 데이터 프레임의 모든 열을 곱하는 방법은 무엇입니까?

  19. 19

    AMP 페이지에서 인라인 스타일을 재정의하는 방법은 무엇입니까?

  20. 20

    PDF 파일의 모든 하이라이트 색상을 변경하는 방법은 무엇입니까?

  21. 21

    amCharts 라인 차트에서 범주 축의 날짜 형식을 지정하는 방법은 무엇입니까?

  22. 22

    디자인 타임에 내 usercontrol을 사용하여 컨트롤을 부모 양식으로 정의하는 방법은 무엇입니까?

  23. 23

    Google 막대 차트 라벨링 동적 데이터. 라벨을 추가하는 방법은 무엇입니까?

  24. 24

    모든 브라우저에서 모든 웹 페이지의 흰색 배경을 수정하는 방법은 무엇입니까?

  25. 25

    모든 브라우저에서 모든 웹 페이지의 흰색 배경을 수정하는 방법은 무엇입니까?

  26. 26

    Highcharts 폴라 차트에서 막대 사이의 빈 공간을 제거하는 방법은 무엇입니까?

  27. 27

    Swift 2에서 임의의 색상에 대한 타이머를 설정하는 방법은 무엇입니까?

  28. 28

    차트 js 막대 차트 모양을 사용자 지정하는 방법은 무엇입니까?

  29. 29

    대상에 따라 WPF 컨트롤의 스타일을 설정하는 방법은 무엇입니까?

뜨겁다태그

보관