>有谁知道如何在前端使用TYPO3焦点区域？ TCA 图像处理
如果我在流体模板中使用裁剪属性
<f:image width="555c" height="312c" src="{article.teaserFile.uid}" treatIdAsReference="1" crop="{article.teaserFile.originalResource.referenceProperties.crop}" />
我在数据焦点区域中得到一个序列化字符串。
<img data-focus-area="{"x":786.1145320197,"y":96.682142857143,"width":271.44177339901,"height":270.05062857143}" src="/fileadmin/_processed_/9/b/csm_testimage_0bfc7bc724.jpg" width="657" height="566" alt="" title="Testimage">
数据是否需要由JS库使用？有人可以在这里推荐图书馆吗？因为我没有找到可以处理焦点区域和属性数据焦点区域的库的建议。
或者我是否必须编写一个视图助手，例如将"jQuery focuspoint"的属性提供给data-focus-x，data-focus-y，data-image-w和data-image-h。
不，您不需要重写 ViewHelpers。(如果将来它可以比现在更好地扩展，那就太好了。
但是你可以实现jQuery Focuspoint。您唯一需要做的就是，在启动焦点插件之前，您可以使用jquery将此数组转换为所需的值。
来自 FocusPoint 文档的示例
$('.focuspoint').focusPoint();
因此，在此行之前，您可以简单地将数组中的值添加为自己的数据属性。
形式不同，但逻辑相同。因此，在焦点区域数组中具有 x、y、宽度和高度值。
例如.js这不适用于 resposify。它需要底部、顶部、左侧、右侧值。
所以是的...它开箱即用。
但是不，你不需要改变PHP部分，因为你可以在前端解决它。(无论如何，您都需要jQuery插件，因此在使用之前编写一些代码会更容易。
当然，更改这些 ViewHelpers 也是一种可能性，但您确实需要重写它们的功能(也是具体的renderImage函数)，如果您想将其更新到更高版本，可能会导致问题。