OpenAI API JsonschemaEditor (依赖Jquery)

用于可视化生成符合OpenAI Jsonschema模式的json字符串js库

使用示例

1.页面中引入 jsonschemaEditor.js 和 jquery 以及fontawesome.com/v5

2.示例代码

<!DOCTYPE html>

<html lang="zh-cn" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title>JsonschemaEditor</title>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
    <script src="jsonschemaEditor.js"></script>
</head>
<body>
    <div id="editor"></div>
    <script>
        var jsonschemaeditor = JsonSchemaEditor.create($("#editor"), {
            schema: '',//如果创建时赋值，会直接进行可视化渲染
            onSave: function (schema) {
                //保存操作
                alert(schema);
            }
        });
        jsonschemaeditor.getSchema();//编辑后获取生成的jsonschema字符串
        jsonschemaeditor.setSchema(newSchemaString);//jsonschema字符串写回编辑器
    </script>
</body>
</html>

示例图1
示例图2

MayDay-wpf/JsonschemaEditorByOpenAI

OpenAI API JsonschemaEditor (依赖Jquery)

使用示例