本文介绍了SVG 动画从 wallclock-sync-value 开始的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

w3c 的 SVG 规范将 wallclock-sync-value 定义为begin"属性的可能值(http://www.w3.org/TR/SVG/animate.html#WallclockSyncValueSyntax).
换句话说:根据实际时钟时间启动动画,而不是基于与文档加载相关的时间.

SVG spec by w3c defines wallclock-sync-value as a possible value for "begin" attribute ( http://www.w3.org/TR/SVG/animate.html#WallclockSyncValueSyntax ).
In other words: start animation based on real clock time, not based on times relative to document loading.

我想在脚本被禁用的情况下创建一个 SVG 时钟.

I want to create a SVG clock in a situation, where scripting is disabled.

我没有找到挂钟用法的任何示例,但基于规范和 ISO8601 ( http://en.wikipedia.org/wiki/ISO_8601 ) 我做了以下例子:

I failed to find any examples of the wallclock usage, but based on the spec and ISO8601 ( http://en.wikipedia.org/wiki/ISO_8601 ) I made following excample:

<text
  x="0"
  y="15"
  opacity="0" >

    <animate
      attributeName="opacity"
      attributeType="XML"
      begin="wallclock(2000-01-01T00:00:00Z)"
      dur="10s"
      values="1; 1; 0; 0"
      keyTimes="0; 0.07; 0.1; 1"
      repeatCount="indefinite" />
  0
</text>

这应该是数字时钟中最右边的0"数字,并且应该每 10 秒闪烁一次.当我设置 begin="0s" 时它起作用.

That should be the rightmost "0" digit in a digital clock, and should flicr every 10 secconds. It works when I set begin="0s".

不幸的是,它没有按预期工作.例如,在 Firefox 开发者控制台中,它给出了一个 js 警告(!?!)意外值 wallclock(2000-01-01T00:00:00Z) 解析开始属性."

Unfortunately it does not work as expected. For example in Firefox developer console it gives a js warning(!?!) "Unexpected value wallclock(2000-01-01T00:00:00Z) parsing begin attribute."

wallclock-sync-value 是否在现代浏览器中实现,以及如何使用它?

Is wallclock-sync-value implemented in modern browsers, and how to use it?

推荐答案

Firefox 目前没有实现挂钟,将来也不会实现.

Firefox doesn't currently implement wallclock and won't be implementing it in the future either.

我们希望它在 SVG 2 中消失并被其他东西取代.我相信其他 UA 的开发人员也有类似的看法.

We expect it to disappear and be replaced by something else in SVG 2. I believe the developers of the other UAs are of a similar opinion.

这篇关于SVG 动画从 wallclock-sync-value 开始的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

07-12 13:12