{"id":704,"date":"2008-02-01T18:32:07","date_gmt":"2008-02-02T02:32:07","guid":{"rendered":"http:\/\/www.andreanolanusse.com\/pt\/?p=704"},"modified":"2012-12-14T23:35:10","modified_gmt":"2012-12-15T07:35:10","slug":"criando-graficos-em-sua-aplicacao-delphi-com-teechart","status":"publish","type":"post","link":"http:\/\/www.andreanolanusse.com\/pt\/criando-graficos-em-sua-aplicacao-delphi-com-teechart\/","title":{"rendered":"Criando gr\u00e1ficos em sua aplica\u00e7\u00e3o Delphi com TeeChart"},"content":{"rendered":"<p>TeeChart \u00e9 um dos componentes de terceiros mais utilizados no Delphi e o que acompanha o Delphi por mais tempo, n\u00e3o me lembro agora, mas j\u00e1 fazem muitos anos que ele est\u00e1 presente. Desenvolvimento pela <strong><a href=\"http:\/\/www.steema.com\/teechart\/vcl\">Steema Software<\/a><\/strong> que ano a ano implementa novas funcionalidades e extende toda os seus componentes para outras linguagens.<\/p>\n<p>\u00c9 muito f\u00e1cil utilizar este componente, posso dizer que para muitos gr\u00e1ficos voc\u00ea n\u00e3o precisaria escrever c\u00f3digo, atrav\u00e9s dos wizards dispon\u00edveis voc\u00ea pode criar gr\u00e1ficos, trazendo dados de um DataSet e pronto, mas claro que existiram situa\u00e7\u00f5es onde voc\u00ea talvez necessita customizar algo e ai codificar ser\u00e1 inevit\u00e1vel.<\/p>\n<p>Assim sendo resolvi escrever este post e mostra um exemplo simples de como seria criar gr\u00e1ficos sem estar conectado a DataSet, ou seja, passar os dados a partir de um array ou algo parecido. O resultado final ser\u00e1 o gr\u00e1fico abaixo, onde se compara m\u00eas a m\u00eas o resultado das vendas de 2008 e 2009, al\u00e9m disso para cada m\u00eas temos o percentual que representou aquele m\u00eas no ano.<\/p>\n<p style=\"text-align: center;\"><a href=\"http:\/\/www.andreanolanusse.com\/pt\/wp-content\/uploads\/2010\/02\/my.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-705\" title=\"TeeChart\" alt=\"\" src=\"http:\/\/www.andreanolanusse.com\/pt\/wp-content\/uploads\/2010\/02\/my.png\" width=\"712\" height=\"508\" srcset=\"http:\/\/www.andreanolanusse.com\/pt\/wp-content\/uploads\/2010\/02\/my.png 826w, http:\/\/www.andreanolanusse.com\/pt\/wp-content\/uploads\/2010\/02\/my-245x175.png 245w, http:\/\/www.andreanolanusse.com\/pt\/wp-content\/uploads\/2010\/02\/my-260x185.png 260w, http:\/\/www.andreanolanusse.com\/pt\/wp-content\/uploads\/2010\/02\/my-705x503.png 705w, http:\/\/www.andreanolanusse.com\/pt\/wp-content\/uploads\/2010\/02\/my-450x321.png 450w\" sizes=\"(max-width: 712px) 100vw, 712px\" \/><\/a><\/p>\n<p>Vamos agora conhecer o c\u00f3digo e saber como foi implementando este gr\u00e1fico, ao final voc\u00ea poder\u00e1 baixar os fontes.<\/p>\n<p>Antes de mais nada, este \u00e9 uma aplica\u00e7\u00e3o VCL, onde foi adicionado o componente TChart e com o bot\u00e3o direito selecione a op\u00e7\u00e3o Edit Chart, adicione duas s\u00e9ries atrav\u00e9s do bot\u00e3o Add, neste exemplo utilizei gr\u00e1ficos de barra.<\/p>\n<p>A fonte de dados deste gr\u00e1fico \u00e9 um array que cont\u00e9m o total vendas para cada m\u00eas.<\/p>\n<pre class=\"brush: pascal;\">var\r\n  i: Integer;\r\n  val : Array[1..12] of Double;\r\nbegin\r\n\r\n  val[1] := 10.2;\r\n  val[2] := 12.2;\r\n  val[3] := 11.7;\r\n  val[4] := 6.3;\r\n  val[5] := 8.0;\r\n  val[6] := 2.9;\r\n  val[7] := 20.3;\r\n  val[8] := 1.4;\r\n  val[9] := 4.5;\r\n  val[10] := 6;\r\n  val[11] := 10;\r\n  val[12] := 15;<\/pre>\n<p>Ap\u00f3s a defini\u00e7\u00e3o da fonte de dados, remove os dados adicionados em tempo de runtime para as duas s\u00e9ries existentes, uma referente ao ano de 2008 e outra ao ano de 2009. Al\u00e9m disso defino que o estilo de apresenta\u00e7\u00e3o dos valores para cada barra ser\u00e1 <strong>percentual<\/strong>, isso quer dizer que ser\u00e1 apresentado o quanto representa o total do m\u00eas no faturamento anual.<\/p>\n<pre class=\"brush: pascal;\">  Series2008.Clear;\r\n  Series2008.Marks.Style := smsPercent;\r\n\r\n  Series2009.Clear;\r\n  Series2009.Marks.Style := smsPercent;<\/pre>\n<p>Depois disso vamos basta adicionar os valores de venda mensal para cada s\u00e9rie (2008, 2009), repare que estou utilizando o array LongMonthNames para o obter o nome do m\u00eas, no meu caso os nomes aparecem em ingl\u00eas, pois utilizo windows em ingl\u00eas, ou seja, ele depende da vers\u00e3o do idioma do seu Windows, caso n\u00e3o queira depender do idioma do seu sistema operacional, basta sobrepor os valores para cada posi\u00e7\u00e3o do Array.<\/p>\n<p>M\u00e9todo Add foi utilizado para adicionar os valores, caso voc\u00ea queira customizar a cor de cada barra, basta adicionar uma cor como terceiro par\u00e2metro ao m\u00e9todo Add.<\/p>\n<pre class=\"brush: pascal;\">for i := 1 to 12 do\r\nbegin\r\nSeries2008.Add(val[i], LongMonthNames[i]);\r\nend;\r\n\r\nfor I := 1 to 12 do\r\nbegin\r\nSeries2009.Add(val[i] \/ (1.45+(i\/10)), LongMonthNames[i]);\r\nend;<\/pre>\n<p>Espero que este simples e objetivo exemplo seja \u00fatil, o c\u00f3digo fonte est\u00e1 dispon\u00edvel <a href=\"http:\/\/cc.embarcadero.com\/Author\/38483\" target=\"_blank\"><strong>aqui<\/strong><\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>TeeChart \u00e9 um dos componentes de terceiros mais utilizados no Delphi e o que acompanha o Delphi por mais tempo, n\u00e3o me lembro agora, mas j\u00e1 fazem muitos anos que ele est\u00e1 presente. Desenvolvimento pela Steema Software que ano a ano implementa novas funcionalidades e extende toda os seus componentes para outras linguagens. \u00c9 muito [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"_s2mail":"yes","footnotes":""},"categories":[102],"tags":[181,93],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v16.2 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Criando gr\u00e1ficos em sua aplica\u00e7\u00e3o Delphi com TeeChart | Andreano Lanusse | Tecnologia e Desenvolvimento de Software<\/title>\n<meta name=\"description\" content=\"TeeChart \u00e9 um dos componentes de terceiros mais utilizados no Delphi e o que acompanha o Delphi por mais tempo, n\u00e3o me lembro agora, mas j\u00e1 fazem muitos\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"http:\/\/www.andreanolanusse.com\/pt\/criando-graficos-em-sua-aplicacao-delphi-com-teechart\/\" \/>\n<meta property=\"og:locale\" content=\"pt_BR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Criando gr\u00e1ficos em sua aplica\u00e7\u00e3o Delphi com TeeChart | Andreano Lanusse | Tecnologia e Desenvolvimento de Software\" \/>\n<meta property=\"og:description\" content=\"TeeChart \u00e9 um dos componentes de terceiros mais utilizados no Delphi e o que acompanha o Delphi por mais tempo, n\u00e3o me lembro agora, mas j\u00e1 fazem muitos\" \/>\n<meta property=\"og:url\" content=\"http:\/\/www.andreanolanusse.com\/pt\/criando-graficos-em-sua-aplicacao-delphi-com-teechart\/\" \/>\n<meta property=\"og:site_name\" content=\"Andreano Lanusse | Tecnologia e Desenvolvimento de Software\" \/>\n<meta property=\"article:published_time\" content=\"2008-02-02T02:32:07+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2012-12-15T07:35:10+00:00\" \/>\n<meta property=\"og:image\" content=\"http:\/\/www.andreanolanusse.com\/pt\/wp-content\/uploads\/2010\/02\/my.png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@andreanolanusse\" \/>\n<meta name=\"twitter:site\" content=\"@andreanolanusse\" \/>\n<meta name=\"twitter:label1\" content=\"Est. tempo de leitura\">\n\t<meta name=\"twitter:data1\" content=\"3 minutos\">\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebSite\",\"@id\":\"http:\/\/www.andreanolanusse.com\/pt\/#website\",\"url\":\"http:\/\/www.andreanolanusse.com\/pt\/\",\"name\":\"Andreano Lanusse | Tecnologia e Desenvolvimento de Software\",\"description\":\"Andreano Lanusse blog - artigos, tutoriais e v&iacute;deos sobre tecnologia, desenvolvimento de software (Delphi XE4, C#, PHP, .NET) e t&eacute;cnicas de programa&ccedil;&atilde;o\",\"publisher\":{\"@id\":\"http:\/\/www.andreanolanusse.com\/pt\/#\/schema\/person\/620bd05e81598c3aba4781796cbe8903\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":\"http:\/\/www.andreanolanusse.com\/pt\/?s={search_term_string}\",\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"pt-BR\"},{\"@type\":\"ImageObject\",\"@id\":\"http:\/\/www.andreanolanusse.com\/pt\/criando-graficos-em-sua-aplicacao-delphi-com-teechart\/#primaryimage\",\"inLanguage\":\"pt-BR\",\"url\":\"http:\/\/www.andreanolanusse.com\/pt\/wp-content\/uploads\/2010\/02\/my.png\",\"contentUrl\":\"http:\/\/www.andreanolanusse.com\/pt\/wp-content\/uploads\/2010\/02\/my.png\",\"width\":826,\"height\":590},{\"@type\":\"WebPage\",\"@id\":\"http:\/\/www.andreanolanusse.com\/pt\/criando-graficos-em-sua-aplicacao-delphi-com-teechart\/#webpage\",\"url\":\"http:\/\/www.andreanolanusse.com\/pt\/criando-graficos-em-sua-aplicacao-delphi-com-teechart\/\",\"name\":\"Criando gr\\u00e1ficos em sua aplica\\u00e7\\u00e3o Delphi com TeeChart | Andreano Lanusse | Tecnologia e Desenvolvimento de Software\",\"isPartOf\":{\"@id\":\"http:\/\/www.andreanolanusse.com\/pt\/#website\"},\"primaryImageOfPage\":{\"@id\":\"http:\/\/www.andreanolanusse.com\/pt\/criando-graficos-em-sua-aplicacao-delphi-com-teechart\/#primaryimage\"},\"datePublished\":\"2008-02-02T02:32:07+00:00\",\"dateModified\":\"2012-12-15T07:35:10+00:00\",\"description\":\"TeeChart \\u00e9 um dos componentes de terceiros mais utilizados no Delphi e o que acompanha o Delphi por mais tempo, n\\u00e3o me lembro agora, mas j\\u00e1 fazem muitos\",\"breadcrumb\":{\"@id\":\"http:\/\/www.andreanolanusse.com\/pt\/criando-graficos-em-sua-aplicacao-delphi-com-teechart\/#breadcrumb\"},\"inLanguage\":\"pt-BR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"http:\/\/www.andreanolanusse.com\/pt\/criando-graficos-em-sua-aplicacao-delphi-com-teechart\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"http:\/\/www.andreanolanusse.com\/pt\/criando-graficos-em-sua-aplicacao-delphi-com-teechart\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"item\":{\"@type\":\"WebPage\",\"@id\":\"http:\/\/www.andreanolanusse.com\/pt\/\",\"url\":\"http:\/\/www.andreanolanusse.com\/pt\/\",\"name\":\"In\\u00edcio\"}},{\"@type\":\"ListItem\",\"position\":2,\"item\":{\"@id\":\"http:\/\/www.andreanolanusse.com\/pt\/criando-graficos-em-sua-aplicacao-delphi-com-teechart\/#webpage\"}}]},{\"@type\":\"Article\",\"@id\":\"http:\/\/www.andreanolanusse.com\/pt\/criando-graficos-em-sua-aplicacao-delphi-com-teechart\/#article\",\"isPartOf\":{\"@id\":\"http:\/\/www.andreanolanusse.com\/pt\/criando-graficos-em-sua-aplicacao-delphi-com-teechart\/#webpage\"},\"author\":{\"@id\":\"http:\/\/www.andreanolanusse.com\/pt\/#\/schema\/person\/620bd05e81598c3aba4781796cbe8903\"},\"headline\":\"Criando gr\\u00e1ficos em sua aplica\\u00e7\\u00e3o Delphi com TeeChart\",\"datePublished\":\"2008-02-02T02:32:07+00:00\",\"dateModified\":\"2012-12-15T07:35:10+00:00\",\"mainEntityOfPage\":{\"@id\":\"http:\/\/www.andreanolanusse.com\/pt\/criando-graficos-em-sua-aplicacao-delphi-com-teechart\/#webpage\"},\"commentCount\":7,\"publisher\":{\"@id\":\"http:\/\/www.andreanolanusse.com\/pt\/#\/schema\/person\/620bd05e81598c3aba4781796cbe8903\"},\"image\":{\"@id\":\"http:\/\/www.andreanolanusse.com\/pt\/criando-graficos-em-sua-aplicacao-delphi-com-teechart\/#primaryimage\"},\"keywords\":[\"Delphi\",\"VCL\"],\"articleSection\":[\"Delphi\"],\"inLanguage\":\"pt-BR\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"http:\/\/www.andreanolanusse.com\/pt\/criando-graficos-em-sua-aplicacao-delphi-com-teechart\/#respond\"]}]},{\"@type\":[\"Person\",\"Organization\"],\"@id\":\"http:\/\/www.andreanolanusse.com\/pt\/#\/schema\/person\/620bd05e81598c3aba4781796cbe8903\",\"name\":\"Andreano Lanusse\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"http:\/\/www.andreanolanusse.com\/pt\/#personlogo\",\"inLanguage\":\"pt-BR\",\"url\":\"http:\/\/0.gravatar.com\/avatar\/6a9c6f73c7c480fb826c7303288abfd3?s=96&d=mm&r=g\",\"contentUrl\":\"http:\/\/0.gravatar.com\/avatar\/6a9c6f73c7c480fb826c7303288abfd3?s=96&d=mm&r=g\",\"caption\":\"Andreano Lanusse\"},\"logo\":{\"@id\":\"http:\/\/www.andreanolanusse.com\/pt\/#personlogo\"},\"sameAs\":[\"https:\/\/twitter.com\/andreanolanusse\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","_links":{"self":[{"href":"http:\/\/www.andreanolanusse.com\/pt\/wp-json\/wp\/v2\/posts\/704"}],"collection":[{"href":"http:\/\/www.andreanolanusse.com\/pt\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/www.andreanolanusse.com\/pt\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/www.andreanolanusse.com\/pt\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/www.andreanolanusse.com\/pt\/wp-json\/wp\/v2\/comments?post=704"}],"version-history":[{"count":0,"href":"http:\/\/www.andreanolanusse.com\/pt\/wp-json\/wp\/v2\/posts\/704\/revisions"}],"wp:attachment":[{"href":"http:\/\/www.andreanolanusse.com\/pt\/wp-json\/wp\/v2\/media?parent=704"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/www.andreanolanusse.com\/pt\/wp-json\/wp\/v2\/categories?post=704"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/www.andreanolanusse.com\/pt\/wp-json\/wp\/v2\/tags?post=704"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}