Форматирование в стиле Google-диаграммы. (На реакцию. js) - PullRequest
0 голосов
/ 22 февраля 2020

У меня есть проблема со стилем css на моем графике Google.

enter image description here 1) как переместить график в другие места на странице?

2) Как изменить цвет панели?

3) А также, почему на панели поставщиков отображается «Обычный пользователь»? Предположительно это должен быть Поставщик: 1.

Понятия не имею для этого? надеюсь, что кто-то может показать мне несколько советов.

рассмотрите код ниже:

<Component
     initialState={{ dataLoadingStatus: 'loading', chartData: [] }}
     didMount={async function(component) {
     const response = await fetch(
     'http://localhost:9000/api/user/total/user',  //call jason api
    )
      const json = await response.json()
      const rateCurrencyNames = Object.keys(json)
      const rateCurrencyValues = Object.values(json)
      const chartData = [['Supplier', 'Normal User']]
      for (let i = 0; i < rateCurrencyNames.length; i += 1) {
      chartData.push([rateCurrencyNames[i], rateCurrencyValues[i]])
      }
      component.setState({
      dataLoadingStatus: 'ready',
      chartData: chartData,
     })
   }}
 >
    {component => {
        return component.state.dataLoadingStatus === 'ready' ? (
         <Chart
            chartType="BarChart"
            data={component.state.chartData}
            width= {700}
            paddingTop={200} // not working
            top= '20px' //not working
            options={{
                  hAxis: {
                      format: '#',
                      minValue: 0,
                    },
                  title: 'System Users Type',
                  legend: 'none',
                  backgroundColor: 'white',
              }}
           />
        ) 
      : (
        <div>Fetching data from API</div>
       )
    }}
</Component>
...