36

私はフルカレンダーでYearViewを開始しました（基本的な「MonthView」から派生し、学校の休日などのより長いイベントを表示するために必要です）。イベントがビューに表示される方法に既に精通している人がいれば、手を使うことができます。

  1. 「BasicEventRenderer」を使用して、「DayEventRenderer」の「segmentContainer」にデータを入力するにはどうすればよいですか？
  2. また、アクティブな年を区切るためのデフォルトの開始日と終了日はいつ初期化できますか？（開始月は変更される可能性があり、当月と当日のハイライトを維持できると便利です）。

https://github.com/Paulmicha/fullcalendarで私のgithubフォークを参照してください

->サンプルファイルはhttps://github.com/Paulmicha/fullcalendar/blob/master/tests/year-view-test-01.htmlです。

ここに画像の説明を入力してください

4

3 に答える 3

11

FullCalendarドキュメント：http ：//arshaw.com/fullcalendar/docs/

イベントをJSONとしてロードする：http：//arshaw.com/fullcalendar/docs/event_data/events_json_feed/

レンダリングイベント：http ：//arshaw.com/fullcalendar/docs/event_rendering/renderEvent/

レンダリングイベントの例：

fc.fullCalendar('renderEvent', {
    'id': 1,
    'title': 'Test Event 1',
    'start': '2009-11-05T13:15:30Z',
    'end': '2009-11-05T13:30:00Z'
});

利用可能な月の表示を制限する：フルカレンダーは利用可能な月の表示を制限しますか？

于 2012-09-18T13:53:45.167 に答える
3

または、年が必要な場合は、次のように表示します。 ここに画像の説明を入力してください

npmhttps : //www.npmjs.com/package/fullcalendar-year-viewからインストールできます

手順：

cd yourFileLocation
npm init (press enter)
npm i fullcalendar-year-view

libファイルを取得するには、yourFileLocation/node_modules/fullcalendar-year-view/dist/

または、ページにbrowserifyを使用することもできます

css＆jslibファイルをページに含めます

最後に「年」ビューを使用します

$('#calendar').fullCalendar({
  header: {
    left: 'prev,next today',
    center: 'title',
    right: 'year,month,basicWeek,basicDay'
  }
  ....
于 2019-01-30T12:47:22.223 に答える
2

ユーザーインターフェイスの代わりに、 bootstrap-year-calendarを使用すると思います。それはあなたが一年を表示し、1日あたり1つまたは複数の値を配置することを可能にしますが、値はホバーまたはクリックでのみ表示されます。

私の必要性のために、それはトリックをしました。

于 2016-10-04T05:43:55.003 に答える