react-native-chart-kit icon indicating copy to clipboard operation
react-native-chart-kit copied to clipboard

Custom xAxis, e.g., horizontal, line drawing has been implemented

Open zahangirbd opened this issue 3 years ago • 1 comments

Custom xAxis, e.g., horizontal, line drawing has been implemented using following variables.

withCustomXAxis customXAxisData

Following feature has been implemented here. https://github.com/indiespirit/react-native-chart-kit/issues/582

Sample implementation:

const customXAxisData = {
        datasets: [
          {
            pts: 10,
            lineStyle: {
              stroke: Colors.brownGrey,
              strokeWidth: 2,
              strokeDasharray: '2, 4',
            },
          },
          {
            pts: 45.00,
            lineStyle: {
              stroke: Colors.appBlue,
              strokeWidth: 2,
            },
          },
        ],
      };
<LineChart
          data={data}
          width={screenWidth}
          height={240}
          chartConfig={chartConfig}
          withShadow={false}
          withInnerLines={false}
          yAxisInterval={10}
          withVerticalLines={false}
          withCustomXAxis
          customXAxisData={customXAxisData}
          style={{marginLeft: -16, marginTop: 16, marginRight: 16}}
          segments={5}
        />

Once it is merged, I shall add vertical line drawing part using the same architecture.

zahangirbd avatar Feb 16 '22 09:02 zahangirbd

ist implemented in master ?

geneshairzan avatar Jun 05 '24 07:06 geneshairzan