nekomikekamoのプロフィール

@nekomikekamo nekomikekamo
ありがとう数101
質問数1
回答数136
ベストアンサー数
71
ベストアンサー率
73%
お礼率
100%

  • chartjsでグラフを選択制にしたい

    chartjsで折れ線グラフを作成しています。 凡例をクリックするとグラフが表示・非表示と切り替わるように、セレクトボックスの選択で表示・非表示を切り替えたいです。 ご教授ください。 よろしくお願いいたします。 下記、現在のコードです。 HTML <select multiple="multiple" name="accessCount" class="select-block" title="アクセス数"> <option value="0">サンプル１</option> <option value="1">サンプル２</option> <option value="2">サンプル３</option> <option value="3">サンプル４</option> </select> <canvas id="chart-line" style="max-width: none"></canvas> js ※文字数上、datasetsの諸々の設定は省略してあります。 var data = { labelsY: ["01\/28 12:00","01\/29 00:00","12:00","01\/30 00:00","12:00"], sample1: [2,0,0,0,0], sample2: [1,0,0,0,0], sample3: false, sample4: false }; var lineData = { labels : data.labelsY, datasets: [ { label: "サンプル１", data: data.sample1, yAxisID: "leftNumberOfPeopleYaxis" }, { label: "サンプル２", data: data.sample2, yAxisID: "leftNumberOfPeopleYaxis" }, { label: "サンプル３", data: data.sample3, yAxisID: "leftNumberOfPeopleYaxis" }, { label: "サンプル４", data: data.sample4, yAxisID: "leftNumberOfPeopleYaxis" }, ], }; var ctx2 = document.getElementById("chart-line").getContext("2d"); var myLineChart = new Chart(ctx2,{ type: 'line', data: lineData, options: { legend: { display: false } }, scales: { xAxes: [ { ticks: { autoSkip: false, } } ], yAxes: [ { id: 'leftNumberOfPeopleYaxis', type: 'linear', position: 'left', scaleLabel: { display: true, labelString: 'アクセス数', }, ticks: { beginAtZero: true, callback: function(value) {if (value % 1 === 0) {return value;}} } }, { id: 'rightTimeYaxis', type: 'linear', position: 'right', scaleLabel: { display: true, labelString: '待機時間', }, ticks: { beginAtZero: true, callback: function(value) {if (value % 1 === 0) {return value;}} } }, ] } } });

  • AtomでjQueryは使えますか？

    ローカルフォルダ内にindex.html、contact.html、style.css、contact.css、script.js、5つのファイルを作成し、Atomでコーディング中です。 index.htmlとcontact.htmlの<head></head>内で<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>とし、</body>直前で<script src="./script.js"></script>、又、script.jsに$(function(){この中にコード});と記述。 (1)まずここで質問ですが、これでjQueryの使用環境は整ってますでしょうか？ 続きまして、先ほどの質問内容とは違ってしまいますが、アコーディオン作成のため、index.html内の <div class="qa"> 　<h1 class="question-text"> <span class="fa fa-question-circle"></span> 名前は何ですか？ 　</h1> <span id="up" class="fa fa-angle-up"></span> <p class="answer-text">ほげほげです。</p> </div>に対してscript.jsにて $('.question-text').click(function(){ var $answer=$(this).parent().find('.answer-text'); if($answer.hasClass('open')){ $answer.removeClass('open'); $answer.slideUp(); $(this).parent().find('#down').html('<span id="up" class="fa fa-angle-up"></span>'); }else{ $answer.addClass('open'); $amswer.slideDown(); 　　$(this).parent().find('#up').html('<span id="down" class="fa fa-angle-down"></span>'); } }); と記述。→グーグルのブラウザで確認。→クリックしても動かない。 という状況です。 (2)ここでまた質問ですが、(1)の時点でjQuery使用環境が整っていれば、動かない理由は単に私のコードが間違っている事になる訳ですが、どうでしょうか・・・？ ご意見賜りたくお願い申し上げます。

  • 【jQuery】要素が消えずに困っています。

    jQuery の FullCalendar をカスタマイズしているのですが、 要素が消えずに困っています。 【希望】 カレンダー内のイベントをクリックすると、 ポップアップみたいに、詳細を表示。 ポップアップ以外をクリックで、ポップアップの非表示。 【現状】 ポップアップの表示まではできています。 カレンダー内のイベントのない日付をクリックするとポップアップは消えますが、 ポップアップが出てる状態で、カレンダー外の部分をクリックすると、 ポップアップがカーソルの場所で再表示されてしまいます。 色々調べて試してみたのですが、ちょっと分からず、 どなたかご教示いただけませんでしょうか。 よろしくお願い致します。 ソース記載します。 $(document).ready(function() { $('body').append('<div class="tooltiptopicevent" style="background-color:#eeeeee; position:absolute; z-index:10000; padding: 10px; line-height: 200%;">details</div>'); $('body').click(function(e) { $('.tooltiptopicevent').css('top', e.pageY + 10); $('.tooltiptopicevent').css('left', e.pageX + 20); }); $('.tooltiptopicevent').hide(); $('#calendar').fullCalendar({ editable: true, googleCalendarApiKey: 'hogehogehogegehogegehoge', eventSources: [ { googleCalendarId: 'hogehogehogegehogegehoge@group.calendar.google.com', className: 'calendar_1' } ], eventClick: function (data, event, view) { $('.tooltiptopicevent').html('イベント名 ' + ': ' + data.title + '</br>' + '詳細 ' + ': ' + [data.description,""][1*(data.description==undefined)]); $('.tooltiptopicevent').show(); }, dayClick: function (data, event, view) { $('.tooltiptopicevent').hide(); }, }); });

  • 平均年齢順に並び替えたい

    https://www.wan55.co.jp/column/detail/id=447 こちらのサイトのサンプルを平均寿命順に並び変えるボタンをつけたいのですが、どういったコードをかけばいいでしょうか。

  • ビープ音＋アラートの実行順

    こんにちは！質問です。 PHPを使用しています。 入力された値をsubmitして、データベースを検索して該当したデータがなければ javascriptで警告音を鳴らしてアラートを表示したいと思っております。 「警告音を鳴らす」→「アラート表示」の順番で実行したいのですが、 「アラート表示」→「OKボタン」→「警告音」の順番で実行されてしまいます。 以下の順番ではできないのでしょうか？ ------------------------------------------------------------------------------ function beep(){ var base64 = 音声ファイルの文字列 var sound = new Audio("data:audio/wav;base64," + base64); sound.play(); } function err() { beep(); window.alert('該当するデータが存在しません。'); } err();//該当するデータがなければ実行する ------------------------------------------------------------------------------ 可能であれば、ソースコードも書いていただければ助かります。 ※chromeを使用しています。IEではアラート表示時にデフォルトの音が鳴るのですが、 音が小さく微妙なのであまり使いたくありません。

もっと見る