diff --git a/App.js b/App.js
index 1048cf8..15388cb 100644
--- a/App.js
+++ b/App.js
@@ -18,13 +18,29 @@ const App = () => {
   //   {value: 100, text: 'May'},
   // ];
 
-  const data = [{value: 50}, {value: 80}, {value: 90}, {value: 70}];
+  const data = [
+    {value: 150},
+    {value: 80, text: 80},
+    {value: 90, text: 90, textColor: 'green', textBackgroundColor: 'pink'},
+    {value: 70},
+  ];
 
   return (
     <View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
-      <BarChart data={data} />
+      <BarChart
+        showGradient
+        gradientColor="gray"
+        frontColor="white"
+        data={data}
+      />
       <LineChart data={data} />
-      <PieChart data={data} />
+      <PieChart
+        showText
+        showTextBackground
+        showValuesAsLabels
+        textSize={14}
+        data={data}
+      />
       {/* <LineChart data={data} curved /> */}
       {/* <BarChart
         data={data}
diff --git a/docs/PieChart/PieChartProps.md b/docs/PieChart/PieChartProps.md
index 68caa96..5fd9b67 100644
--- a/docs/PieChart/PieChartProps.md
+++ b/docs/PieChart/PieChartProps.md
@@ -1,28 +1,37 @@
 # Pie Chart props
 
-| Prop            | Type           | Description                                                                      | Default value |
-| --------------- | -------------- | -------------------------------------------------------------------------------- | ------------- |
-| data            | Array of items | An item object represents a section in the Pie chart. Descibed in the next table | \_            |
-| radius          | number         | Radius of the Pie chart                                                          | 120           |
-| isThreeD        | Boolean        | If set to true, it rotates and translates the chart to give it a 3D effect       | false         |
-| shadow          | Boolean        | Shadow to the Pie chart, when set to true, it enhances the 3D effect             | false         |
-| shadowColor     | ColorValue     | Color of the shadow                                                              | lightgray     |
-| shadowWidth     | number         | Width of the shadow                                                              | radius\*4/3   |
-| strokeWidth     | number         | Stroke (line) width for the Pie chart and its section                            | 0             |
-| strokeColor     | ColorValue     | Stroke (line) color                                                              | gray          |
-| textColor       | ColorValue     | Color of the label texts                                                         | random colors |
-| textSize        | number         | Size of the label texts (max allowed: radius / 5)                                | 24            |
-| backgroundColor | ColorValue     | Background color of the container that contains the Pie chart                    | white         |
+| Prop                 | Type           | Description                                                                      | Default value |
+| -------------------- | -------------- | -------------------------------------------------------------------------------- | ------------- |
+| data                 | Array of items | An item object represents a section in the Pie chart. Descibed in the next table | \_            |
+| radius               | number         | Radius of the Pie chart                                                          | 120           |
+| isThreeD             | Boolean        | If set to true, it rotates and translates the chart to give it a 3D effect       | false         |
+| shadow               | Boolean        | Shadow to the Pie chart, when set to true, it enhances the 3D effect             | false         |
+| shadowColor          | ColorValue     | Color of the shadow                                                              | lightgray     |
+| shadowWidth          | number         | Width of the shadow                                                              | radius\*4/3   |
+| strokeWidth          | number         | Stroke (line) width for the Pie chart and its section                            | 0             |
+| strokeColor          | ColorValue     | Stroke (line) color                                                              | gray          |
+| backgroundColor      | ColorValue     | Background color of the container that contains the Pie chart                    | white         |
+| showText             | Boolean        | When set to true, displays text on the Pie sections                              | false         |
+| textColor            | ColorValue     | Color of the label texts                                                         | random colors |
+| textSize             | number         | Size of the label texts (max allowed: radius / 5)                                | 16            |
+| showTextBackground   | Boolean        | When set to true, displays background for text on the Pie sections               | false         |
+| textBackgroundColor  | ColorValue     | Background color for the label texts                                             | white         |
+| textBackgroundRadius | number         | Radius for the background of the text labels                                     | textSize      |
+| showValuesAsLabels   | Boolean        | When set to true, the values of the Pie sections are displayed as labels         | false         |
 
 ### Item description
 
-| Prop      | Type       | Description                                                            |
-| --------- | ---------- | ---------------------------------------------------------------------- |
-| value     | number     | Value of the item, representing a section of the Pie chart             |
-| shiftX    | number     | Translates (shifts) the particular section horizontally by given value |
-| shiftY    | number     | Translates (shifts) the particular section vertically by given value   |
-| color     | ColorValue | Color (background color) of the section                                |
-| textColor | ColorValue | Color of the text (label) inside the section                           |
+| Prop                 | Type       | Description                                                            |
+| -------------------- | ---------- | ---------------------------------------------------------------------- |
+| value                | number     | Value of the item, representing a section of the Pie chart             |
+| shiftX               | number     | Translates (shifts) the particular section horizontally by given value |
+| shiftY               | number     | Translates (shifts) the particular section vertically by given value   |
+| color                | ColorValue | Color (background color) of the section                                |
+| text                 | string     | Label text for the sections                                            |
+| textColor            | ColorValue | Color of the text (label) inside the section                           |
+| textSize             | number     | Size of the text (label) inside the section                            |
+| textBackgroundColor  | ColorValue | Background color for the label text                                    |
+| textBackgroundRadius | number     | Radius for the background of the text label                            |
 
 ### Donut chart related props
 
diff --git a/package.json b/package.json
index b19c80e..b2f1c63 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "react-native-gifted-charts",
-  "version": "0.0.4",
+  "version": "0.0.5",
   "description": "The most complete library for Bar, Line, Area, Pie and Donut charts in React Native. Allows 2D, 3D, gradient, animations and live data updates.",
   "main": "src/index.tsx",
   "files": [
diff --git a/src/BarChart/index.tsx b/src/BarChart/index.tsx
index 03b3716..baf9c53 100644
--- a/src/BarChart/index.tsx
+++ b/src/BarChart/index.tsx
@@ -318,7 +318,7 @@ export const BarChart = (props: PropTypes) => {
           {
             marginLeft: initialSpacing + 6,
             position: 'absolute',
-            bottom: stepHeight * -0.5 - 60,
+            bottom: stepHeight * -0.5 - 60 + xAxisThickness,
           },
           horizontal && {width: totalWidth},
         ]}
diff --git a/src/PieChart/index.tsx b/src/PieChart/index.tsx
index 1405c4f..02d037b 100644
--- a/src/PieChart/index.tsx
+++ b/src/PieChart/index.tsx
@@ -19,20 +19,30 @@ type propTypes = {
   shadowWidth?: number;
   strokeWidth?: number;
   strokeColor?: string;
-  textColor?: string;
-  textSize?: number;
   backgroundColor?: string;
   data: Array<itemType>;
+
+  showText?: Boolean;
+  textColor?: string;
+  textSize?: number;
+  showTextBackground?: Boolean;
+  textBackgroundColor?: string;
+  textBackgroundRadius?: number;
+  showValuesAsLabels?: Boolean;
 };
 type itemType = {
   value: number;
   shiftX?: number;
   shiftY?: number;
   color?: string;
+  text?: string;
   textColor?: string;
+  textSize?: number;
+  textBackgroundColor?: string;
+  textBackgroundRadius?: number;
 };
 export const PieChart = (props: propTypes) => {
-  const {data, isThreeD, textColor} = props;
+  const {data, isThreeD} = props;
   const radius = props.radius || 120;
   const shadowWidth = props.shadowWidth || (4 * radius) / 3;
   const backgroundColor = props.backgroundColor || 'white';
@@ -50,7 +60,14 @@ export const PieChart = (props: propTypes) => {
   const strokeWidth = props.strokeWidth || 0;
   const strokeColor =
     props.strokeColor || (strokeWidth ? 'gray' : 'transparent');
-  const textSize = props.textSize ? Math.min(props.textSize, radius / 5) : 24;
+
+  const showText = props.showText || false;
+  const textColor = props.textColor || '';
+  const textSize = props.textSize ? Math.min(props.textSize, radius / 5) : 16;
+
+  const showTextBackground = props.showTextBackground || false;
+  const showValuesAsLabels = props.showValuesAsLabels || false;
+
   let isDataShifted = false;
   data.forEach((item: any) => {
     total += item.value;
@@ -80,7 +97,6 @@ export const PieChart = (props: propTypes) => {
     }
     canvas.width = canvasWidth;
     const ctx = canvas.getContext('2d');
-    ctx.font = textSize + 'px Comic Sans MS';
     ctx.lineWidth = strokeWidth;
     ctx.strokeStyle = strokeColor;
     const initialValue = 30;
@@ -177,34 +193,68 @@ export const PieChart = (props: propTypes) => {
       ctx.fillStyle = dataItem.color || colors[i++ % 8];
       ctx.fill();
 
-      semiSum = angleSum + (pi * dataItem.value) / total;
-      yy = Math.sin(semiSum) * radius + (radius + initialValue + shiftX);
-      xx = Math.cos(semiSum) * radius + (radius + initialValue + shiftY);
-      // console.log('semisum==>>', semiSum);
-      // console.log('sin(semisum)==>>', Math.sin(semiSum));
-      if (semiSum > 0 && semiSum <= pi / 2) {
-        xx -= 40;
-        yy -= 10;
-      } else if (semiSum > pi / 2 && semiSum <= pi) {
-        xx += 10;
-        yy -= 10;
-      } else if (semiSum > pi && semiSum <= 1.5 * pi) {
-        xx += 10;
-        yy += 24;
-      } else {
-        xx -= 40;
-        yy += 24;
+      /*************************        Displaying Text Labels      **********************/
+
+      if (showText) {
+        let fontSize;
+        if (props.textSize) {
+          fontSize = Math.min(props.textSize, radius / 5);
+        } else if (dataItem.textSize) {
+          fontSize = Math.min(dataItem.textSize, radius / 5);
+        } else {
+          fontSize = 16;
+        }
+        ctx.font = fontSize + 'px Comic Sans MS';
+        semiSum = angleSum + (pi * dataItem.value) / total;
+        yy = Math.sin(semiSum) * radius + (radius + initialValue + shiftX);
+        xx = Math.cos(semiSum) * radius + (radius + initialValue + shiftY);
+
+        // console.log('semisum==>>', semiSum);
+        // console.log('sin(semisum)==>>', Math.sin(semiSum));
+        if (semiSum > 0 && semiSum <= pi / 2) {
+          xx -= 40;
+          yy -= 10;
+        } else if (semiSum > pi / 2 && semiSum <= pi) {
+          xx += 10;
+          yy -= 10;
+        } else if (semiSum > pi && semiSum <= 1.5 * pi) {
+          xx += 10;
+          yy += 24;
+        } else {
+          xx -= 40;
+          yy += 24;
+        }
+
+        if (showTextBackground && (dataItem.text || showValuesAsLabels)) {
+          let textBackgroundX = xx + textSize / 2;
+          let textBackgroundY = yy - textSize / 2 + 1;
+          ctx.beginPath();
+          ctx.arc(
+            textBackgroundX,
+            textBackgroundY,
+            props.textBackgroundRadius ||
+              dataItem.textBackgroundRadius ||
+              textSize,
+            0,
+            2 * pi,
+            false,
+          );
+          ctx.fillStyle =
+            props.textBackgroundColor ||
+            dataItem.textBackgroundColor ||
+            'white';
+          ctx.fill();
+        }
+
+        ctx.fillStyle = dataItem.textColor || textColor || colors[i++ % 8];
+        let labelText = dataItem.text || '';
+        if (showValuesAsLabels && !labelText) {
+          labelText = dataItem.value.toString();
+        }
+        ctx.fillText(labelText, xx, yy);
       }
 
-      // console.log('xx-->', xx)
-      // console.log('yy-->', yy)
-
-      // ctx.moveTo(xx, yy)
-
-      // ctx.arc(xx, yy, 10, 0, 2 * pi)
-
-      ctx.fillStyle = dataItem.textColor || textColor || colors[i++ % 8];
-      ctx.fillText(dataItem.value.toString(), xx, yy);
+      /****************************************************************************************/
 
       angleSum += (2 * pi * dataItem.value) / total;
     });