deepseek v3-0324实现SVG 编辑器

最新推荐文章于 2025-04-03 15:48:14 发布
最新推荐文章于 2025-04-03 15:48:14 发布
阅读量299 收藏 6
点赞数 4
分类专栏： deepseek 工具 文章标签： 编辑器 javascript 开发语言 deepseek
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/Liudef06/article/details/146975480
版权

SVG 编辑器 HTML

以下是一个简单的基于HTML/JavaScript的SVG编辑器代码。这个编辑器允许你绘制基本形状（矩形、圆形、线条等），修改它们的属性，并导出SVG代码。
在这里插入图片描述

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>简易SVG编辑器</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            margin: 0;
            padding: 20px;
            display: flex;
            flex-direction: column;
            height: 100vh;
        }
        .container {
            display: flex;
            flex: 1;
            gap: 20px;
        }
        #toolbar {
            display: flex;
            gap: 10px;
            margin-bottom: 20px;
            padding: 10px;
            background: #f0f0f0;
            border-radius: 5px;
        }
        button {
            padding: 8px 12px;
            cursor: pointer;
        }
        #editor-panel {
            flex: 3;
            border: 1px solid #ccc;
            position: relative;
        }
        #svg-canvas {
            width: 100%;
            height: 100%;
            background-color: white;
        }
        #properties-panel {
            flex: 1;
            border: 1px solid #ccc;
            padding: 15px;
            overflow-y: auto;
        }
        .property-group {
            margin-bottom: 15px;
        }
        label {
            display: block;
            margin-bottom: 5px;
            font-weight: bold;
        }
        input, select {
            width: 100%;
            padding: 8px;
            margin-bottom: 10px;
            box-sizing: border-box;
        }
        #svg-code {
            width: 100%;
            height: 200px;
            margin-top: 20px;
            font-family: monospace;
        }
        .shape {
            cursor: move;
        }
        .shape.selected {
            outline: 2px dashed #0066ff;
        }
    </style>
</head>
<body>
    <h1>简易SVG编辑器</h1>
    
    <div id="toolbar">
        <button id="select-btn">选择</button>
        <button id="rect-btn">矩形</button>
        <button id="circle-btn">圆形</button>
        <button id="ellipse-btn">椭圆</button>
        <button id="line-btn">线条</button>
        <button id="text-btn">文本</button>
        <button id="delete-btn">删除</button>
        <button id="export-btn">导出SVG</button>
    </div>
    
    <div class="container">
        <div id="editor-panel">
            <svg id="svg-canvas" xmlns="http://www.w3.org/2000/svg"></svg>
        </div>
        
        <div id="properties-panel">
            <h3>属性编辑器</h3>
            <div id="shape-properties">
                <p>选择一个元素来编辑其属性</p>
            </div>
            
            <h3>SVG代码</h3>
            <textarea id="svg-code" readonly></textarea>
            <button id="copy-code-btn">复制代码</button>
        </div>
    </div>

    <script>
        document.addEventListener('DOMContentLoaded', function() {
            const svgCanvas = document.getElementById('svg-canvas');
            const shapeProperties = document.getElementById('shape-properties');
            const svgCodeTextarea = document.getElementById('svg-code');
            let selectedElement = null;
            let isDrawing = false;
            let currentTool = 'select';
            let startX, startY;
            
            // 工具按钮事件监听
            document.getElementById('select-btn').addEventListener('click', () => currentTool = 'select');
            document.getElementById('rect-btn').addEventListener('click', () => currentTool = 'rect');
            document.getElementById('circle-btn').addEventListener('click', () => currentTool = 'circle');
            document.getElementById('ellipse-btn').addEventListener('click', () => currentTool = 'ellipse');
            document.getElementById('line-btn').addEventListener('click', () => currentTool = 'line');
            document.getElementById('text-btn').addEventListener('click', () => currentTool = 'text');
            
            document.getElementById('delete-btn').addEventListener('click', deleteSelected);
            document.getElementById('export-btn').addEventListener('click', exportSVG);
            document.getElementById('copy-code-btn').addEventListener('click', copySVGCode);
            
            // SVG画布事件监听
            svgCanvas.addEventListener('mousedown', startDrawing);
            svgCanvas.addEventListener('mousemove', draw);
            svgCanvas.addEventListener('mouseup', endDrawing);
            svgCanvas.addEventListener('mouseleave', endDrawing);
            
            // 开始绘制
            function startDrawing(e) {
                if (currentTool === 'select') {
                    const target = e.target.closest('.shape');
                    if (target) {
                        selectElement(target);
                    } else {
                        deselectElement();
                    }
                    return;
                }
                
                isDrawing = true;
                const rect = svgCanvas.getBoundingClientRect();
                startX = e.clientX - rect.left;
                startY = e.clientY - rect.top;
                
                if (currentTool === 'text') {
                    createText(startX, startY);
                    isDrawing = false;
                }
            }
            
            // 绘制过程中
            function draw(e) {
                if (!isDrawing || currentTool === 'select' || currentTool === 'text') return;
                
                const rect = svgCanvas.getBoundingClientRect();
                const x = e.clientX - rect.left;
                const y = e.clientY - rect.top;
                
                if (!selectedElement) {
                    // 创建新元素
                    switch (currentTool) {
                        case 'rect':
                            selectedElement = document.createElementNS('http://www.w3.org/2000/svg', 'rect');
                            break;
                        case 'circle':
                            selectedElement = document.createElementNS('http://www.w3.org/2000/svg', 'circle');
                            break;
                        case 'ellipse':
                            selectedElement = document.createElementNS('http://www.w3.org/2000/svg', 'ellipse');
                            break;
                        case 'line':
                            selectedElement = document.createElementNS('http://www.w3.org/2000/svg', 'line');
                            selectedElement.setAttribute('x1', startX);
                            selectedElement.setAttribute('y1', startY);
                            break;
                    }
                    
                    if (selectedElement) {
                        selectedElement.classList.add('shape');
                        svgCanvas.appendChild(selectedElement);
                        updateShapeProperties();
                    }
                }
                
                // 更新元素属性
                if (selectedElement) {
                    switch (currentTool) {
                        case 'rect':
                            selectedElement.setAttribute('x', Math.min(startX, x));
                            selectedElement.setAttribute('y', Math.min(startY, y));
                            selectedElement.setAttribute('width', Math.abs(x - startX));
                            selectedElement.setAttribute('height', Math.abs(y - startY));
                            break;
                        case 'circle':
                            const radius = Math.sqrt(Math.pow(x - startX, 2) + Math.pow(y - startY, 2));
                            selectedElement.setAttribute('cx', startX);
                            selectedElement.setAttribute('cy', startY);
                            selectedElement.setAttribute('r', radius);
                            break;
                        case 'ellipse':
                            const rx = Math.abs(x - startX);
                            const ry = Math.abs(y - startY);
                            selectedElement.setAttribute('cx', startX);
                            selectedElement.setAttribute('cy', startY);
                            selectedElement.setAttribute('rx', rx);
                            selectedElement.setAttribute('ry', ry);
                            break;
                        case 'line':
                            selectedElement.setAttribute('x2', x);
                            selectedElement.setAttribute('y2', y);
                            break;
                    }
                    
                    // 设置默认样式
                    if (!selectedElement.getAttribute('fill')) {
                        selectedElement.setAttribute('fill', 'blue');
                    }
                    if (!selectedElement.getAttribute('stroke')) {
                        selectedElement.setAttribute('stroke', 'black');
                    }
                    if (!selectedElement.getAttribute('stroke-width')) {
                        selectedElement.setAttribute('stroke-width', '2');
                    }
                    
                    updateShapeProperties();
                }
            }
            
            // 结束绘制
            function endDrawing() {
                isDrawing = false;
            }
            
            // 创建文本元素
            function createText(x, y) {
                deselectElement();
                selectedElement = document.createElementNS('http://www.w3.org/2000/svg', 'text');
                selectedElement.classList.add('shape');
                selectedElement.setAttribute('x', x);
                selectedElement.setAttribute('y', y);
                selectedElement.setAttribute('fill', 'black');
                selectedElement.textContent = '双击编辑文本';
                svgCanvas.appendChild(selectedElement);
                
                selectedElement.addEventListener('dblclick', function() {
                    const newText = prompt('输入文本:', this.textContent);
                    if (newText !== null) {
                        this.textContent = newText;
                        updateShapeProperties();
                        updateSVGCode();
                    }
                });
                
                selectElement(selectedElement);
                updateShapeProperties();
                updateSVGCode();
            }
            
            // 选择元素
            function selectElement(element) {
                deselectElement();
                selectedElement = element;
                selectedElement.classList.add('selected');
                updateShapeProperties();
                updateSVGCode();
                
                // 添加拖拽功能
                let isDragging = false;
                let offsetX, offsetY;
                
                selectedElement.addEventListener('mousedown', startDrag);
                
                function startDrag(e) {
                    if (currentTool !== 'select') return;
                    
                    isDragging = true;
                    const rect = selectedElement.getBoundingClientRect();
                    offsetX = e.clientX - rect.left;
                    offsetY = e.clientY - rect.top;
                    
                    e.preventDefault(); // 防止文本选择
                }
                
                svgCanvas.addEventListener('mousemove', drag);
                svgCanvas.addEventListener('mouseup', endDrag);
                svgCanvas.addEventListener('mouseleave', endDrag);
                
                function drag(e) {
                    if (!isDragging || !selectedElement) return;
                    
                    const rect = svgCanvas.getBoundingClientRect();
                    const x = e.clientX - rect.left - offsetX;
                    const y = e.clientY - rect.top - offsetY;
                    
                    if (selectedElement.tagName === 'text') {
                        selectedElement.setAttribute('x', x);
                        selectedElement.setAttribute('y', y);
                    } else if (selectedElement.tagName === 'circle') {
                        selectedElement.setAttribute('cx', x + offsetX);
                        selectedElement.setAttribute('cy', y + offsetY);
                    } else if (selectedElement.tagName === 'ellipse') {
                        selectedElement.setAttribute('cx', x + offsetX);
                        selectedElement.setAttribute('cy', y + offsetY);
                    } else if (selectedElement.tagName === 'line') {
                        const x1 = parseFloat(selectedElement.getAttribute('x1'));
                        const y1 = parseFloat(selectedElement.getAttribute('y1'));
                        const x2 = parseFloat(selectedElement.getAttribute('x2'));
                        const y2 = parseFloat(selectedElement.getAttribute('y2'));
                        
                        const dx = x - (x1 + x2) / 2 + offsetX;
                        const dy = y - (y1 + y2) / 2 + offsetY;
                        
                        selectedElement.setAttribute('x1', x1 + dx);
                        selectedElement.setAttribute('y1', y1 + dy);
                        selectedElement.setAttribute('x2', x2 + dx);
                        selectedElement.setAttribute('y2', y2 + dy);
                    } else if (selectedElement.tagName === 'rect') {
                        selectedElement.setAttribute('x', x);
                        selectedElement.setAttribute('y', y);
                    }
                    
                    updateShapeProperties();
                    updateSVGCode();
                }
                
                function endDrag() {
                    isDragging = false;
                }
            }
            
            // 取消选择元素
            function deselectElement() {
                if (selectedElement) {
                    selectedElement.classList.remove('selected');
                    selectedElement = null;
                    shapeProperties.innerHTML = '<p>选择一个元素来编辑其属性</p>';
                }
            }
            
            // 删除选中元素
            function deleteSelected() {
                if (selectedElement) {
                    svgCanvas.removeChild(selectedElement);
                    deselectElement();
                    updateSVGCode();
                }
            }
            
            // 更新形状属性面板
            function updateShapeProperties() {
                if (!selectedElement) return;
                
                let html = '<div class="property-group">';
                html += `<h4>${selectedElement.tagName}</h4>`;
                
                // 通用属性
                html += `
                    <label>填充颜色</label>
                    <input type="color" id="fill-color" value="${selectedElement.getAttribute('fill') || 'none'}">
                    
                    <label>描边颜色</label>
                    <input type="color" id="stroke-color" value="${selectedElement.getAttribute('stroke') || 'none'}">
                    
                    <label>描边宽度</label>
                    <input type="number" id="stroke-width" value="${selectedElement.getAttribute('stroke-width') || '1'}" min="0" step="0.5">
                `;
                
                // 特定属性
                switch (selectedElement.tagName) {
                    case 'rect':
                        html += `
                            <label>X坐标</label>
                            <input type="number" id="rect-x" value="${selectedElement.getAttribute('x')}" step="0.1">
                            
                            <label>Y坐标</label>
                            <input type="number" id="rect-y" value="${selectedElement.getAttribute('y')}" step="0.1">
                            
                            <label>宽度</label>
                            <input type="number" id="rect-width" value="${selectedElement.getAttribute('width')}" min="0" step="0.1">
                            
                            <label>高度</label>
                            <input type="number" id="rect-height" value="${selectedElement.getAttribute('height')}" min="0" step="0.1">
                        `;
                        break;
                    case 'circle':
                        html += `
                            <label>中心X</label>
                            <input type="number" id="circle-cx" value="${selectedElement.getAttribute('cx')}" step="0.1">
                            
                            <label>中心Y</label>
                            <input type="number" id="circle-cy" value="${selectedElement.getAttribute('cy')}" step="0.1">
                            
                            <label>半径</label>
                            <input type="number" id="circle-r" value="${selectedElement.getAttribute('r')}" min="0" step="0.1">
                        `;
                        break;
                    case 'ellipse':
                        html += `
                            <label>中心X</label>
                            <input type="number" id="ellipse-cx" value="${selectedElement.getAttribute('cx')}" step="0.1">
                            
                            <label>中心Y</label>
                            <input type="number" id="ellipse-cy" value="${selectedElement.getAttribute('cy')}" step="0.1">
                            
                            <label>X半径</label>
                            <input type="number" id="ellipse-rx" value="${selectedElement.getAttribute('rx')}" min="0" step="0.1">
                            
                            <label>Y半径</label>
                            <input type="number" id="ellipse-ry" value="${selectedElement.getAttribute('ry')}" min="0" step="0.1">
                        `;
                        break;
                    case 'line':
                        html += `
                            <label>起点X</label>
                            <input type="number" id="line-x1" value="${selectedElement.getAttribute('x1')}" step="0.1">
                            
                            <label>起点Y</label>
                            <input type="number" id="line-y1" value="${selectedElement.getAttribute('y1')}" step="0.1">
                            
                            <label>终点X</label>
                            <input type="number" id="line-x2" value="${selectedElement.getAttribute('x2')}" step="0.1">
                            
                            <label>终点Y</label>
                            <input type="number" id="line-y2" value="${selectedElement.getAttribute('y2')}" step="0.1">
                        `;
                        break;
                    case 'text':
                        html += `
                            <label>X坐标</label>
                            <input type="number" id="text-x" value="${selectedElement.getAttribute('x')}" step="0.1">
                            
                            <label>Y坐标</label>
                            <input type="number" id="text-y" value="${selectedElement.getAttribute('y')}" step="0.1">
                            
                            <label>文本内容</label>
                            <input type="text" id="text-content" value="${selectedElement.textContent}">
                            
                            <label>字体大小</label>
                            <input type="number" id="text-font-size" value="${selectedElement.getAttribute('font-size') || '16'}" min="1">
                        `;
                        break;
                }
                
                html += '</div>';
                shapeProperties.innerHTML = html;
                
                // 添加事件监听器
                document.getElementById('fill-color').addEventListener('input', function() {
                    selectedElement.setAttribute('fill', this.value);
                    updateSVGCode();
                });
                
                document.getElementById('stroke-color').addEventListener('input', function() {
                    selectedElement.setAttribute('stroke', this.value);
                    updateSVGCode();
                });
                
                document.getElementById('stroke-width').addEventListener('input', function() {
                    selectedElement.setAttribute('stroke-width', this.value);
                    updateSVGCode();
                });
                
                // 特定属性事件监听
                switch (selectedElement.tagName) {
                    case 'rect':
                        document.getElementById('rect-x').addEventListener('input', function() {
                            selectedElement.setAttribute('x', this.value);
                            updateSVGCode();
                        });
                        document.getElementById('rect-y').addEventListener('input', function() {
                            selectedElement.setAttribute('y', this.value);
                            updateSVGCode();
                        });
                        document.getElementById('rect-width').addEventListener('input', function() {
                            selectedElement.setAttribute('width', this.value);
                            updateSVGCode();
                        });
                        document.getElementById('rect-height').addEventListener('input', function() {
                            selectedElement.setAttribute('height', this.value);
                            updateSVGCode();
                        });
                        break;
                    case 'circle':
                        document.getElementById('circle-cx').addEventListener('input', function() {
                            selectedElement.setAttribute('cx', this.value);
                            updateSVGCode();
                        });
                        document.getElementById('circle-cy').addEventListener('input', function() {
                            selectedElement.setAttribute('cy', this.value);
                            updateSVGCode();
                        });
                        document.getElementById('circle-r').addEventListener('input', function() {
                            selectedElement.setAttribute('r', this.value);
                            updateSVGCode();
                        });
                        break;
                    case 'ellipse':
                        document.getElementById('ellipse-cx').addEventListener('input', function() {
                            selectedElement.setAttribute('cx', this.value);
                            updateSVGCode();
                        });
                        document.getElementById('ellipse-cy').addEventListener('input', function() {
                            selectedElement.setAttribute('cy', this.value);
                            updateSVGCode();
                        });
                        document.getElementById('ellipse-rx').addEventListener('input', function() {
                            selectedElement.setAttribute('rx', this.value);
                            updateSVGCode();
                        });
                        document.getElementById('ellipse-ry').addEventListener('input', function() {
                            selectedElement.setAttribute('ry', this.value);
                            updateSVGCode();
                        });
                        break;
                    case 'line':
                        document.getElementById('line-x1').addEventListener('input', function() {
                            selectedElement.setAttribute('x1', this.value);
                            updateSVGCode();
                        });
                        document.getElementById('line-y1').addEventListener('input', function() {
                            selectedElement.setAttribute('y1', this.value);
                            updateSVGCode();
                        });
                        document.getElementById('line-x2').addEventListener('input', function() {
                            selectedElement.setAttribute('x2', this.value);
                            updateSVGCode();
                        });
                        document.getElementById('line-y2').addEventListener('input', function() {
                            selectedElement.setAttribute('y2', this.value);
                            updateSVGCode();
                        });
                        break;
                    case 'text':
                        document.getElementById('text-x').addEventListener('input', function() {
                            selectedElement.setAttribute('x', this.value);
                            updateSVGCode();
                        });
                        document.getElementById('text-y').addEventListener('input', function() {
                            selectedElement.setAttribute('y', this.value);
                            updateSVGCode();
                        });
                        document.getElementById('text-content').addEventListener('input', function() {
                            selectedElement.textContent = this.value;
                            updateSVGCode();
                        });
                        document.getElementById('text-font-size').addEventListener('input', function() {
                            selectedElement.setAttribute('font-size', this.value);
                            updateSVGCode();
                        });
                        break;
                }
            }
            
            // 更新SVG代码显示
            function updateSVGCode() {
                const serializer = new XMLSerializer();
                const svgString = serializer.serializeToString(svgCanvas);
                svgCodeTextarea.value = svgString;
            }
            
            // 导出SVG
            function exportSVG() {
                updateSVGCode();
                const blob = new Blob([svgCodeTextarea.value], {type: 'image/svg+xml'});
                const url = URL.createObjectURL(blob);
                const a = document.createElement('a');
                a.href = url;
                a.download = 'drawing.svg';
                document.body.appendChild(a);
                a.click();
                document.body.removeChild(a);
                URL.revokeObjectURL(url);
            }
            
            // 复制SVG代码
            function copySVGCode() {
                updateSVGCode();
                svgCodeTextarea.select();
                document.execCommand('copy');
                alert('SVG代码已复制到剪贴板');
            }
        });
    </script>
</body>
</html>

功能说明

这个SVG编辑器具有以下功能：

  1. 绘图工具：

    • 选择工具：选择和移动现有元素
    • 矩形工具：绘制矩形
    • 圆形工具：绘制圆形
    • 椭圆工具：绘制椭圆
    • 线条工具：绘制直线
    • 文本工具：添加文本

  2. 编辑功能：

    • 修改元素的属性（位置、大小、颜色等）
    • 双击文本元素可编辑文本内容
    • 删除选中的元素

  3. 导出功能：

    • 查看生成的SVG代码
    • 复制SVG代码到剪贴板
    • 导出SVG文件

使用方法

  1. 选择左侧工具栏中的绘图工具
  2. 在画布上点击并拖动来绘制形状
  3. 使用选择工具点击元素来选中它
  4. 在右侧属性面板中修改选中元素的属性
  5. 使用导出按钮保存您的SVG作品

您可以将此代码保存为HTML文件并在浏览器中打开它来使用这个SVG编辑器。

vue-webtopo-svgeditor:纯vue3实现的svg可视化web布局编辑器。主要用于物联网mqtt实时系统图
03-21
纯vue3实现的svg可视化web布局编辑器。主要用于物联网mqtt实时系统图 预览地址 如何使用 # 克隆项目 git clone https://github.com/yaolunmao/vue-webtopo-svgeditor.git # 进入项目目录 cd vue-webtopo-svgeditor #...
react-svg-editor:SVG图像编辑器作为React组件。 完全不完整
05-13
React SVG编辑器 一个用于创建SVG图像的简单UI小部件。 非常非常不完整。 设置 git clone https://github.com/asolove/react-svg-editor.git cd react-svg-editor npm install npm start 在浏览器中打开index....
deepseek v3-0324 化学键线式Canvas编辑器设计
Liudef06的博客
04-01 783
下面是一个基于HTML5 Canvas的化学键线式编辑器的基本实现方案。这个编辑器允许用户绘制有机化学中常见的键线式结构。
deepseek v3 0324实现工作流编辑器
Liudef06的博客
03-31 6834
HTML 工作流编辑器
Cyber Weekly #45
产品老A，7年互联网大厂AIPM，专注探索新型人机交互
03-02 954
赛博周刊 (Cyber Weekly），每周日发布，欢迎关注、点赞、收藏、评论。
【AI News | 20250317】每日AI进展
Jungle胡的博客
03-17 831
OpenAI首席产品官Kevin Weil透露，GPT-5“很快推出”，或整合GPT-4与O系列能力，并预测年内AI代码自动化达99%，远超预期，称AI已超越顶级程序员。用户更新至最新版后，通过「汪仔」按钮或快捷键激活AI助手，新增「=号」搜索功能实现边聊边查，「AI划词」则支持搜索、翻译、总结等操作，无需切换应用。快手可灵AI全面接入DeepSeek-R1，增强视频与图片生成能力，用户可轻松将灵感转为专业提示词，降低创作门槛，提升效率。该项目深化阿里云AI布局，通过“借调”方式吸纳人才，提升团队创新力。
51c大模型~合集99
whaosoft~aiotの开发板商城
12-31 1266
最成功的≠最复杂的高端的食材，往往需要最朴素的烹饪方式。AI 发展到后半场「大雾散去」，如何让大模型的智力落实成执行力，智能体似乎成了业界的共同答案。从元宝到混元，各类智能体平台如雨后春笋般涌现。上个月，智谱发布 AutoGLM 的发布会上，智能体好像突破了次元壁，一句指令，就拿着手机在现场发了一个总计两万块钱的红包。我们正在见证一个重要的转折点：智能体正在将 AI 的能力从「能说会道」转变为「能做会干」。作为最强大模型厂商的有力竞争者，Anthropic 推出的智能体功能也着实惊艳了我们一把。
51c大模型~合集66
whaosoft~aiotの开发板商城
11-19 855
本文介绍了一种新颖的文本到 3D 场景生成策略 DreamScene。通过生成模式采样和相机采样策略，将物体和环境整合在一起，解决了目前文本到 3D 场景生成方法中存在的低效、不一致和可编辑性有限等问题。广泛的实验证明，DreamScene 是三维场景生成领域的一项里程碑式成就，在众多领域，如游戏、影视和房屋设计中有着巨大的应用潜力。
AI程序员(aider)+ollama+DeepSeek-R1安装配置和使用
zg_hover的专栏
02-16 1144
aider其实是ai coder的缩写，可以说是一个ai programmer，可以根据需求编写代码，可以分析代码，重构代码等。比一般的代码助手更加智能。目前还处于比较初级的版本，但已经具备一定的可用性。 本文介绍aider的本地部署和使用，通过ollama的部署和使用可以让aider使用本地部署的大模型。比如：qwen或deepseek等。ollama的安装和模型的拉取，可以参考我前面的文章，这里不再赘述。
51c大模型~合集9
whaosoft~aiotの开发板商城
11-01 1394
在训练过程中，我们随机提取语义标记序列的前缀部分作为提示，以利用语言模型的上下文学习能力。接着，根据 “圆的周长” 知识点，通过圆心角的大小为 90 度和 Mary 走过的路径长度的条件，计算出圆形花坛的周长，并求得圆形花坛的半径。最后，根据 “圆的面积” 知识点，通过求得的半径的条件，计算出圆形花坛的面积，至此完成题目的求解。并且如下图所示，为了缓解模型在解决问题过程中固有的问题，我们参考教材与维基百科，启发式的引入了 67 个知识点的描述，从而为 LMMs 的推理过程提供必要的知识提示。
Matplotlib绘图革命：智能化工具助力数据可视化新高度
inscode_081的博客
03-06 896
最新接入DeepSeek-V3模型，点击下载最新版本InsCode AI IDE 标题：Matplotlib绘图革命：智能化工具助力数据可视化新高度 在当今数据驱动的世界中，数据可视化已成为数据分析和决策过程中不可或缺的一部分。Matplotlib作为Python中最受欢迎的数据可视化库之一，凭借其灵活性和强大的功能，广泛应用于各个领域。然而，对于许多编程新手来说，掌握Matplotlib的复杂语...
save-ps-to-svg 1.0.zip
06-12
此外，由于SVG是文本格式，所以可以使用文本编辑器查看和编辑其代码，进一步优化路径数据。对于高级用户，还可以通过这种方式进行更精细的控制，例如调整颜色、添加动画等。 总的来说，“save-ps-to-svg 1.0”脚本...
svg-edit-react:基于SVG编辑svgcanvas的基于React的编辑器
04-30
该编辑器演示了带有React用户界面的SVG编辑“ svgcanvas”的用法。 它远没有原始的SVG-edit完整，但这是一个概念证明，我们可能决定在将来的SVGedit版本中使用。 要对此进行测试，您必须克隆并运行： npm install...
save-ps-to-svg1.0.jsx 让Ps支持svg格式
12-31
这个脚本的实现原理是通过Photoshop的API接口，读取当前文档的信息，然后转换为SVG的结构。虽然Photoshop本身不内置SVG导出功能，但通过 ExtendScript，开发者可以创建自定义工具来弥补这种不足。 总的来说，"save-...
墨笔 在线Markdown 编辑器
kongzhonghu的专栏
04-02 413
墨笔 Markdown 编辑器是一个简单而强大的工具，它让 Markdown 写作变得更加轻松愉快。无论您是专业写作者还是普通用户，都能快速上手使用。墨笔 Markdown 编辑器如果您觉得这个工具对您有帮助，欢迎通过捐助支持我们的开发工作。
【零基础入门unity游戏开发——2D篇】2D 游戏场景地形编辑器——TileMap的使用介绍
最新发布
向宇
04-03 1444
【零基础入门unity游戏开发——2D篇】2D 游戏场景编辑器——TileMap的使用介绍
deepseek v3-0324 Markdown 编辑器 HTML
Liudef06的博客
04-03 390
以下是一个美观的 Markdown 编辑器 HTML 页面，支持多种主题切换和实时预览功能： 表格示例 功能 支持 标题 ✓ 列表 ✓ 代码块 ✓ 表格 ✓ Markdown导出 ${marked.parse(editor.value)} `; ``` 功能特点 实时预览：左侧编辑，右侧实时显示渲染结果 多种主题：提供6种美观主题可供选择 代码高亮：使用highlight.js实现代码
红宝书第二十九讲：详解编辑器和IDE：VS Code与WebStorm
kovlistudio的博客
04-03 544
红宝书第二十九讲：详解编辑器和IDE：VS Code与WebStorm
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值