Google Chrome 115

Google Chrome 115 の安定版が7月12日にリリースされました。

Chrome 115 release note

以下のリンクに主な変更点の情報が記載されています。

https://chromestatus.com/roadmap

https://developer.chrome.com/blog/new-in-chrome-115/

Pickup for WebClass

今回の変更の中に、WebClassに影響があるものはありませんでした。

気になる変更点

Web上での色んな表現のためにJavaScriptや複雑なCSSを駆使しして頑張っていたものが、ブラウザ側の機能追加で楽になるのですが、今回はScroll driven animationsが実装されました。WebClass上では派手な見た目が求められないため有効活用できることは少ないのですが、表現の幅を広げるためにチェックはしておきたいです。

今後の Chrome リリースについて

次回のリリースは2023年8月9日に予定されています。

その他ブラウザのリリースはこちらにまとめています。

Google Chrome 114

Google Chrome 114 の安定版が5月30日にリリースされました。

Chrome 114 release note

以下のリンクに主な変更点の情報が記載されています。

https://chromestatus.com/roadmap

https://developer.chrome.com/blog/new-in-chrome-114/

Pickup for WebClass

今回の変更の中に、WebClassに影響があるものはありませんでした。

気になる変更点

text-wrap:balance

CSS text-wrapの新しい設定です。こちらのデモを見ていただけると分かりやすいですが、複数行にわたって表示される文について、各行の長さをできるだけ揃えます。

使用にあたっては制限があるのと、日本語では上手く動いていない気がしますが、少し試しただけなのでよく分かっていません。

今後の Chrome リリースについて

次回のリリースは2023年7月18日に予定されています。

その他ブラウザのリリースはこちらにまとめています。

修学カルテの新機能をご紹介します (WebClass v11.14.1)

WebClass v11.14.1 がリリースされます。修学カルテに追加される新機能について、用例とともにご紹介します。

ルーブリックに初期値を設定できるようになった

ルーブリックの各行に対して、初期値を設定できるようになりました。以下のように、<dimension>タグにdefault属性を設定します。

<field_template id="cook" type="rubric" title="調理実践" >
  <rubric>
    <rubric_header>
      <level value="0"/>
      <level value="1"/>
      <level value="2"/>
      <level value="3"/>
      <level value="4"/>
    </rubric_header>
    <dimension
        id="cut"
        title="切る"
        description="切り方の習熟度合を評価します"
        default="2">
      <option level="0">まったくできなかった</option>
      <option level="1">あまりできなかった</option>
      <option level="2">ふつう</option>
      <option level="3">少しできた</option>
      <option level="4">よくできた</option>
    </dimension>
  </rubric>
</field_template>

<mark-complete>タグに親子関係を設定して、複数カードの「済」と「未」のステータスを一度に変更できるようになった

<mark-complete>は、カード上部に完了ボタンを設置する機能です。

<static_card id="grade1" title="1年次" edit-protect-target="false">
     <mark-complete id="complete" title="全課程修了" complete-target="self" edit-auth="self"></mark-complete>
     <field id="cook" ref="cook"></field>
</static_card>

完了ボタンをクリックすると、完了状態に切り替わります。

アドバイザーからは、どの学生が完了状態になっているかが一覧で確認できます。

今回の機能追加で、<mark-complete>下に<child>を設定することで、一つの完了ボタンを押すと、同時に他のカードの完了ボタンも一括でステータスが変わるようになりました。

記述式の入力欄でform_type=texareaのとき、初期の行数の高さを設定できるようになった

テキスト入力欄の行数(高さ)を、rows属性で設定できます。

<field_template
  id="summarize"
  type="text"
  form_type="textarea"
  title="総括"
  edit-auth="self"
  rows="20" ></field_template>

Firefox 112

Firefox 112 が 4月11日にリリースされました。

Firefox 112 release note

以下のリンクに主な変更点の情報が記載されています。

Pickup for WebClass

今回のリリースでは、WebClass に影響はありません。

今後の Firefox リリースについて

次回のリリースは 5 月 9 日に予定されています。

Firefox Release Calendar

その他ブラウザのリリースはこちらにまとめています。

修学カルテの新機能について (WebClass v11.14.0)

WebClass v11.14.0 がリリースされます。この記事では、修学カルテに追加された機能について解説します。

積み上げ棒グラフ

修学カルテでは、入力状況をグラフで可視化できます。このリリースで、積み上げ棒グラフでの可視化に対応しました。

上のイメージは、学生が1年次から4年次までに受けた試験の合計点を可視化するグラフです。問題の分野別に点数を積み上げています。

積み上げ棒グラフを表示するためには、カルテXMLで<stacked-bar-graph>を指定します。詳しい説明はマニュアルをご覧ください。また、手元の環境ですぐに試してみたい方は、以下のXMLをダウンロードして登録してみてください。

積み上げ棒グラフ.xml

グラフをカード内に表示できるようになりました

これまで各種グラフはSummaryタブ内でのみ表示可能でしたが、カード内でも表示できるようになりました(今回対応しているカードは<static_card>のみです)。

グラフをカード内で表示するためには、これまで<summary>内で指定していた<rubric-chart>などを<static_card>直下に記述するだけです。

使用例は次の変更でまとめて紹介します。

入力フィールドの入力値を、別の場所に表示する

入力フィールドの入力値を、別の場所に表示できるようになりました。たとえば年度ごとに振り返りをするカルテで、 今年度の目標を入力する画面に、参考として前年度の振り返りを表示するような使い方ができます。

この画面の上半分は、前年度の振り返り時に入力した内容が表示されています。また、前年度の入力内容をレーダーチャートで可視化しています。これらを参照しながら、下半分で今年度の振り返りを入力していきます。

別の場所の入力フィールドを参照して表示するには、<copy-field>を使用します。詳しくはマニュアルを参照してください。

これらの機能を試してみたい方は、以下のXMLを使用してみてください。

入力フィールドの入力値を別の場所に表示する.xml

タブ、入力項目のラベルなどの色を変更できるようになった

以下のイメージでは、タブや入力項目のラベルの色を変更しています。年次や日などの入力タイミングの違いを分かりやすくするために、色の差で表現している例です。

設定例は以下のXMLを参照してください。

色変更.xml