How to display custom image at the place of point in react-google-chart?

半腔热情 提交于 2020-06-28 04:11:23

问题


On the places of star I want to display some custom images like face emojis.I'm using the react-google-chart library here . So far, my code is as below

           import { Chart } from "react-google-charts";
           ...

           <Chart
              width={'500px'}
              height={'300px'}
              chartType="AreaChart"
              loader={<div>Loading Chart</div>}
              data={[
                ['Year',  'Expenses', {'type': 'string', 'role': 'style'}],
                ['2013',  400, null],
                ['2014',  460, null],
                ['2015',  1120, 'point { size: 18; shape-type: star; fill-color: #a52714; }'],
                ['2016',  540, null],
              ]}
              options={{
                title: 'Company Performance',
                hAxis: { title: 'Year', titleTextStyle: { color: '#333' } },
                vAxis: { minValue: 0 },
                // For the legend to fit, we make the chart area smaller
                chartArea: { width: '50%', height: '70%' },
                // lineWidth: 25
                pointSize: 20,
                // series: {
                //   0: { pointShape: { type: 'star', sides: 5, dent: 0.5 } }
                // }
              }}
              // For tests
              rootProps={{ 'data-testid': '1' }}
            />

来源:https://stackoverflow.com/questions/62303548/how-to-display-custom-image-at-the-place-of-point-in-react-google-chart

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!