{"id":631,"date":"2024-05-24T10:57:30","date_gmt":"2024-05-24T10:57:30","guid":{"rendered":"https:\/\/investors.bajajauto.com\/ar24\/?page_id=631"},"modified":"2024-06-20T13:43:48","modified_gmt":"2024-06-20T13:43:48","slug":"total-operating-income-operating-profit-and-pat","status":"publish","type":"page","link":"https:\/\/investors.bajajauto.com\/ar24\/total-operating-income-operating-profit-and-pat\/","title":{"rendered":"Total Operating Income-Operating Profit and PA"},"content":{"rendered":"\n\t<section class=\"section\" id=\"section_2034293223\">\n\t\t<div class=\"bg section-bg fill bg-fill  bg-loaded\" >\n\n\t\t\t\n\t\t\t\n\t\t\t\n\n\t\t<\/div>\n\n\t\t\n\n\t\t<div class=\"section-content relative\">\n\t\t\t\n\n<h2>Total Operating Income, Operating Profit and PAT<\/h2>\n\t<div id=\"gap-222523998\" class=\"gap-element clearfix\" style=\"display:block; height:auto;\">\n\t\t\n<style>\n#gap-222523998 {\n  padding-top: 30px;\n}\n<\/style>\n\t<\/div>\n\t\n\n\n\n<!DOCTYPE html>\n<html>\n<head>\n  <title>Interactive Combo Chart Example<\/title>\n  <script src=\"https:\/\/cdn.jsdelivr.net\/npm\/chart.js\"><\/script>\n  <style>\n    \/* Add some CSS for the 3D effect on the bars *\/\n    .chart-container {\n      position: relative;\n      height: 60vh;\n      width: 80vw;\n      max-width: 100%;\n      margin: auto;\n    }\n    .bar-shadow {\n      filter: drop-shadow(3px 3px 3px rgba(0, 0, 255, 0.4));\n    }\n  <\/style>\n<\/head>\n<body>\n  <div class=\"chart-container\">\n    <canvas id=\"comboChart\"><\/canvas>\n  <\/div>\n\n  <script>\n    \/\/ Sample data\n    const data = {\n      labels: [\"FY2009\", \"FY2010\", \"FY2011\", \"FY2012\", \"FY2013\", \"FY2014\", \"FY2015\", \"FY2016\", \"FY2017\", \"FY2018\", \"FY2019\", \"FY2020\", \"FY2021\", \"FY2022\", \"FY2023\", \"FY2024\"],\n      totalOperatingIncome: [8810, 11943, 16609, 19804, 20351, 20348, 21817, 22688, 21933, 25322, 30358, 29919, 27741, 33145, 36428, 44685],\n      operatingProfit: [1052, 2451, 3257, 3834, 3825, 4125, 4050, 4632, 4364, 4697, 4926, 4850, 4666, 4983, 6229, 8422],\n      pat: [656, 1704, 3340, 3004, 3044, 3243, 2814, 3930, 3828, 4068, 4675, 5100, 4555, 5019, 5628, 7479]\n    };\n\n    \/\/ Create the combo chart\n    const ctx = document.getElementById(\"comboChart\").getContext(\"2d\");\n    const comboChart = new Chart(ctx, {\n      type: 'bar',\n      data: {\n        labels: data.labels,\n        datasets: [\n          {\n            label: \"PAT\",\n            yAxisID: \"pat\", \/\/ Use separate yAxisID for PAT\n            data: data.pat,\n            type: \"line\",\n            fill: false,\n            borderColor: \"#0db04b\",\n            borderWidth: 2,\n            pointBackgroundColor: \"#0db04b\",\n            pointBorderColor: \"#fff\",\n            pointHoverBackgroundColor: \"#fff\",\n            pointHoverBorderColor: \"#0db04b\",\n            pointRadius: 5,\n            pointHoverRadius: 7,\n            tension: 0,\n            z: 2 \/\/ Ensure line is drawn over bars\n          },\n          {\n            label: \"Operating Profit\",\n            yAxisID: \"pat\",\n            data: data.operatingProfit,\n            type: \"line\",\n            fill: false,\n            borderColor: \"#f05a22\",\n            borderWidth: 2,\n            pointBackgroundColor: \"#f05a22\",\n            pointBorderColor: \"#fff\",\n            pointHoverBackgroundColor: \"#fff\",\n            pointHoverBorderColor: \"#f05a22\",\n            pointRadius: 5,\n            pointHoverRadius: 7,\n            tension: 0,\n            z: 0 \/\/ Ensure line is drawn over bars\n          },\n          {\n            label: \"Total Operating Income\",\n            yAxisID: \"y\",\n            data: data.totalOperatingIncome,\n            backgroundColor: \"rgba(6, 86, 219)\", \/\/ Transparent background color\n            borderColor: \"#0656db\", \/\/ Border color\n            borderWidth: 1,\n            hoverBackgroundColor: \"rgba(6, 86, 219, 0.6)\",\n            hoverBorderColor: \"#0656db\",\n            barThickness: 'flex', \/\/ Reduce thickness by half\n            barPercentage: 1, \/\/ Adjust bar width percentage\n            categoryPercentage: 0.5, \/\/ Adjust category width percentage\n            z: 3 \/\/ Ensure bar graph is behind\n          }\n        ]\n      },\n      options: {\n        responsive: true,\n        maintainAspectRatio: false,\n        animation: {\n          duration: 2000,\n          easing: 'easeInOutBounce'\n        },\n        scales: {\n          x: {\n            grid: {\n              display: false, \/\/ Remove gridlines for X-axis\n            },\n            title: {\n              display: false,\n              text: \"Financial Years\"\n            }\n          },\n          y: {\n            beginAtZero: true,\n            grid: {\n              display: true \/\/ Enable gridlines for Y-axis\n            },\n            title: {\n              display: true,\n              text: \"Total Operating Income (\u20b9 In Crore)\"\n            },\n            max: 50000 \/\/ Set the maximum value for Total Operating Income\n          },\n          pat: {\n            position: \"right\",\n            beginAtZero: true,\n            grid: {\n              display: false\n            },\n            title: {\n              display: true,\n              text: \"Operating Profit and PAT (\u20b9 In Crore)\"\n            },\n            max: 10000 \/\/ Set the maximum value for Operating Profit and PAT\n          }\n        },\n        plugins: {\n          tooltip: {\n            enabled: true,\n            mode: 'index',\n            intersect: false,\n          },\n          legend: {\n            display: true,\n            position: 'top',\n            labels: {\n              usePointStyle: true,\n              pointStyle: 'circle',\n            }\n          }\n        },\n        hover: {\n          mode: 'nearest',\n          intersect: true,\n          onHover: function(e) {\n            const points = comboChart.getElementsAtEventForMode(e, 'nearest', { intersect: true }, false);\n            if (points.length) {\n              const datasetIndex = points[0].datasetIndex;\n              if (datasetIndex === 1 || datasetIndex === 2) { \/\/ Adjust for line datasets\n                points[0].element.options.animation.duration = 500;\n                points[0].element.options.animation.easing = 'easeOutBounce';\n              }\n            }\n          }\n        },\n        elements: {\n          bar: {\n            borderSkipped: false,\n            borderColor: '#0656db',\n            shadowOffsetX: 3,\n            shadowOffsetY: 3,\n            shadowBlur: 10,\n            shadowColor: 'rgba(173, 216, 230, 0.5)',\n            transform: 'rotateY(10deg)',\n            transformOrigin: 'bottom',\n          },\n          line: {\n            tension: 0,\n          }\n        }\n      }\n    });\n  <\/script>\n<\/body>\n<\/html>\n\n\n\t\t<\/div>\n\n\t\t\n<style>\n#section_2034293223 {\n  padding-top: 30px;\n  padding-bottom: 30px;\n}\n<\/style>\n\t<\/section>\n\t\n\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"om_disable_all_campaigns":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"class_list":["post-631","page","type-page","status-publish","hentry"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/investors.bajajauto.com\/ar24\/wp-json\/wp\/v2\/pages\/631","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/investors.bajajauto.com\/ar24\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/investors.bajajauto.com\/ar24\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/investors.bajajauto.com\/ar24\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/investors.bajajauto.com\/ar24\/wp-json\/wp\/v2\/comments?post=631"}],"version-history":[{"count":10,"href":"https:\/\/investors.bajajauto.com\/ar24\/wp-json\/wp\/v2\/pages\/631\/revisions"}],"predecessor-version":[{"id":1675,"href":"https:\/\/investors.bajajauto.com\/ar24\/wp-json\/wp\/v2\/pages\/631\/revisions\/1675"}],"wp:attachment":[{"href":"https:\/\/investors.bajajauto.com\/ar24\/wp-json\/wp\/v2\/media?parent=631"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}