Back to Plugins
画板json导出 Export Frame JSON

画板json导出 Export Frame JSON

画板json导出插件允许你轻松导出所选 frame 的 JSON 数据。通过简单的操作,你可以快速获取 Figma 设计中的 frame 属性,并将其复制用于其他开发或设计需求。

frame jsonexport jsonjson

Plugin Preview

画板json导出 Export Frame JSON preview

About this plugin

Introduction

This plugin is designed to help users export detailed JSON data of selected nodes, including auto layout information, Frame nesting relationships, text properties, and more. With this plugin, users can easily retrieve structured data from design elements, facilitating data analysis, secondary development, or documentation.


功能

  1. Export complete JSON data of selected nodes, including properties like type, name, size, position, fills, strokes, and more.
  2. Support exporting text content, font name, font size, and other properties of text nodes.
  3. Support nested export of nodes such as Frame, Group, Component, and Instance, preserving the full hierarchical structure.
  4. Complete export of auto layout information, including layout mode, primary and secondary axis alignment, padding, and spacing.
  5. Safely serialized JSON data export ensures compatibility and completeness.


Usage Instructions

  1. Select one or more nodes from which you want to export data.
  2. Click the export button in the plugin, and the plugin will automatically extract all relevant information from the selected nodes and generate JSON data.
  3. The exported JSON data will be displayed in the plugin interface, allowing users to copy or download it for further use.


Notes

  1. This plugin currently supports exporting properties of common node types such as Frame.
  2. Ensure that the selected node types are supported by the plugin; otherwise, related data might not be exportable.
  3. If errors occur during the export process, check whether the nodes contain excessive nesting or complex properties. Simplify the structure if needed and try again.


简介

本插件旨在帮助用户导出选定节点的详细 JSON 数据,包括节点的自动布局信息、Frame 嵌套关系、文本属性等。通过此插件,用户可以轻松地获取设计元素的结构化数据,便于进行数据分析、二次开发或文档记录。


功能

  1. 导出选定节点的完整 JSON 数据,包括节点的类型、名称、尺寸、位置、填充、边框等属性。
  2. 支持导出文本节点的文本内容、字体名称、字号等属性。
  3. 支持 Frame、Group、Component、Instance 等节点类型的嵌套导出,保留完整的层次结构。
  4. 自动布局信息的完整导出,包括布局模式、主次轴对齐方式、填充和间距等。
  5. 导出的 JSON 数据经过安全序列化,确保兼容性和完整性。


使用说明

  1. 选中一个或多个需要导出数据的节点。
  2. 在插件中点击导出按钮,插件将自动提取选定节点的所有相关信息并生成 JSON 数据。
  3. 导出的 JSON 数据将会显示在插件界面中,用户可以复制或下载该数据用于其他用途。


注意事项

  1. 本插件目前只支持导出 Frame节点类型的属性。
  2. 请确保选定的节点类型受插件支持,否则可能无法导出相关数据。
  3. 如果导出过程中出现错误,请检查节点是否包含过多层次的嵌套或复杂的属性,建议简化结构后再试。

Plugin Details

Version3
CreatedAugust 7, 2024
Last UpdatedAugust 12, 2024
CategoryImport & export plugins
CreatorKingweiCheung
Stats40 installs, 7 likes
PricingFree

Technical Details

  • API:1.0.0
  • UI:ui.html
  • main:code.js
  • Document Access:dynamic-page
  • Editor Types:
    figma
  • Allowed Domains:
    • none