HTML,CSS簡単グラフ作成

ショウタロウ

: HTML,CSS簡単グラフ作成

項目に記入するだけで簡単にグラフをHTMLとCSSのコードに変換できます。

108

がお気に入り登録しました。

投稿日時：

プロンプト実行例

「グラフ形式, タイトル」に表示したいグラフ形式とグラフのタイトルを記入してください。次に「名前, パーセント」に記入して実行するとHTMLとCSSのコードが出力されます。

グラフ形式 , タイトル

名前 , パーセント

html
1<!DOCTYPE html>
2<html>
3  <head>
4    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
5    <script type="text/javascript">
6      google.charts.load('current', {'packages':['corechart']});
7      google.charts.setOnLoadCallback(drawChart);
8
9      function drawChart() {
10        var data = google.visualization.arrayToDataTable([
11          ['血液型', '割合'],
12          ['A型', 40],
13          ['B型', 30],
14          ['O型', 20],
15          ['AB型', 10]
16        ]);
17
18        var options = {
19          title: '血液型割合',
20          width: 400,
21          height: 300,
22          colors: ['#ff9999', '#ffcc99', '#ffff99', '#ccff99']
23        };
24
25        var chart = new google.visualization.BarChart(document.getElementById('chart_div'));
26        chart.draw(data, options);
27      }
28    </script>
29  </head>
30  <body>
31    <div id="chart_div"></div>
32  </body>
33</html>

他のプロンプトもチェック

チャットボット
反論AI
反論AIです。
5
0
44
687
アディラスサブ
マーケティング一般
カスタマージャーニー
顧客の深層ニーズや課題を把握し、商品やサービスの価値提案を明確にします。「自社のターゲットとなりうる顧客」と「その顧客が抱えている課題」をキーワードで入力すると、顧客のライフスタイル、消費行動、目標、動機、パーソナリティを包括的に分析し、ユーザーペイン、そしてペインリリーバーとなるセールスワードを生成、今後のマーケティング戦略を提言してくれます。
21
0
406
1.49K
hirokaji
コード生成・修正
プログラミング言語「Panorama」のスクリプトコードを生成！！
プログラミング言語「Panorama」のスクリプトコードを生成します！！
0
0
2
94
アディラス
文案作成
推奨モデル - GPT 4o
怪談アシスタント★怖い話やホラー作品の制作に！
お題を投げると、怪談を話してくれます。また、怖い話のアドバイスを求めることも可能です。プロンプト内容の一部は、自分のホラーコンテンツ制作のノウハウを詰め込みました。 https://game.had2apps.com/ #ホラー #horror #ジャパニーズホラー #japanesehorror #怪談 #実話怪談 #恐怖
2
0
22
124
はどはど

HTML,CSS簡単グラフ作成

コメント 0

他のプロンプトもチェック