ovi054 commited on
Commit
4d92d66
1 Parent(s): a41644c

Create app.py

Browse files
Files changed (1) hide show
  1. app.py +146 -0
app.py ADDED
@@ -0,0 +1,146 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ import gradio as gr
2
+ import vtracer
3
+ import os
4
+
5
+ def convert_to_vector(image, colormode, hierarchical, mode, filter_speckle, color_precision, layer_difference, corner_threshold, length_threshold, max_iterations, splice_threshold, path_precision):
6
+ input_path = "temp_input.jpg"
7
+ output_path = "svg_output.svg"
8
+
9
+ # Save the input image to a temporary file
10
+ image.save(input_path)
11
+
12
+ # Convert the image to SVG using VTracer
13
+ vtracer.convert_image_to_svg_py(
14
+ input_path,
15
+ output_path,
16
+ colormode=colormode,
17
+ hierarchical=hierarchical,
18
+ mode=mode,
19
+ filter_speckle=int(filter_speckle),
20
+ color_precision=int(color_precision),
21
+ layer_difference=int(layer_difference),
22
+ corner_threshold=int(corner_threshold),
23
+ length_threshold=float(length_threshold),
24
+ max_iterations=int(max_iterations),
25
+ splice_threshold=int(splice_threshold),
26
+ path_precision=int(path_precision)
27
+ )
28
+ # Read the SVG output
29
+ with open(output_path, "r") as f:
30
+ svg_content = f.read()
31
+
32
+ # Return the SVG file path instead of content
33
+ return gr.HTML(f'<svg viewBox="0 0 {image.width} {image.height}">{svg_content}</svg>'), output_path
34
+ # return output_path,output_path
35
+
36
+ def handle_color_mode(value):
37
+ # You can change this to display the selected value without any prefix
38
+ return value
39
+
40
+
41
+ css = """
42
+ #col-container {
43
+ margin: 0 auto;
44
+ max-width: 960px;
45
+ }
46
+ .generate-btn {
47
+ background: linear-gradient(90deg, #4B79A1 0%, #283E51 100%) !important;
48
+ border: none !important;
49
+ color: white !important;
50
+ }
51
+ .generate-btn:hover {
52
+ transform: translateY(-2px);
53
+ box-shadow: 0 5px 15px rgba(0,0,0,0.2);
54
+ }
55
+ """
56
+
57
+ # Define the Gradio interface
58
+ with gr.Blocks(css=css) as app:
59
+ with gr.Column(elem_id="col-container"):
60
+ gr.HTML("""
61
+ <div style="text-align: center;">
62
+ <h2>Image to Vector Converter ⚡</h2>
63
+ <p>Converts raster images (JPG, PNG, WEBP) to vector graphics (SVG).</p>
64
+ </div>
65
+ """)
66
+ with gr.Row():
67
+ with gr.Column():
68
+ image_input = gr.Image(type="pil", label="Upload Image")
69
+ with gr.Accordion("Advanced Settings", open=False):
70
+ with gr.Accordion("Clustering", open=False):
71
+ colormode = gr.Radio([("COLOR","color"),("B/W", "binary")], value="color", label="Color Mode", show_label=False)
72
+ filter_speckle = gr.Slider(0, 128, value=4, step=1, label="Filter Speckle", info="Cleaner")
73
+ color_precision = gr.Slider(1, 8, value=6, step=1, label="Color Precision")
74
+ layer_difference = gr.Slider(0, 128, value=16, step=1, label="Layer Difference")
75
+ hierarchical = gr.Radio([("STACKED","stacked"), ("CUTOUT","cutout")], value="stacked", label="Hierarchical Mode",show_label=False)
76
+ with gr.Accordion("Curve Fitting", open=False):
77
+ mode = gr.Radio([("SPLINE","spline"),("POLYGON", "polygon"), ("PIXEL","none")], value="spline", label="Mode", show_label=False)
78
+ corner_threshold = gr.Slider(0, 180, value=60, step=1, label="Corner Threshold")
79
+ length_threshold = gr.Slider(3.5, 10, value=4.0, step=0.1, label="Length Threshold")
80
+ splice_threshold = gr.Slider(0, 180, value=45, step=1, label="Splice Threshold")
81
+ max_iterations = gr.Slider(1, 20, value=10, step=1, label="Max Iterations", visible=False)
82
+ path_precision = gr.Slider(1, 10, value=3, step=1, label="Path Precision", visible=False)
83
+ output_text = gr.Textbox(label="Selected Mode")
84
+ convert_button = gr.Button("✨ Convert to SVG", variant='primary', elem_classes=["generate-btn"])
85
+
86
+ with gr.Column():
87
+ html = gr.HTML(label="SVG Output") # container=True, show_label=True
88
+ svg_output = gr.File(label="Download SVG")
89
+ # Store default values for restoration
90
+ colormode.change(handle_color_mode, inputs=colormode,outputs=output_text)
91
+ hierarchical.change(handle_color_mode, inputs=hierarchical,outputs=output_text)
92
+ mode.change(handle_color_mode, inputs=mode,outputs=output_text)
93
+ default_values = {
94
+ "color_precision": 6,
95
+ "layer_difference": 16
96
+ }
97
+
98
+ def update_interactivity_and_visibility(colormode, color_precision_value, layer_difference_value):
99
+ is_color_mode = colormode == "color"
100
+ return (
101
+ gr.update(interactive=is_color_mode),
102
+ gr.update(interactive=is_color_mode),
103
+ gr.update(visible=is_color_mode) # Show/Hide Hierarchical Mode
104
+ )
105
+
106
+ colormode.change(
107
+ update_interactivity_and_visibility,
108
+ inputs=[colormode, color_precision, layer_difference],
109
+ outputs=[color_precision, layer_difference, hierarchical]
110
+ )
111
+
112
+ def update_interactivity_and_visibility_for_mode(mode):
113
+ is_spline_mode = mode == "spline"
114
+ return (
115
+ gr.update(interactive=is_spline_mode),
116
+ gr.update(interactive=is_spline_mode),
117
+ gr.update(interactive=is_spline_mode)
118
+ )
119
+
120
+ mode.change(
121
+ update_interactivity_and_visibility_for_mode,
122
+ inputs=[mode],
123
+ outputs=[corner_threshold,length_threshold,splice_threshold]
124
+ )
125
+
126
+ convert_button.click(
127
+ convert_to_vector,
128
+ inputs=[
129
+ image_input,
130
+ colormode,
131
+ hierarchical,
132
+ mode,
133
+ filter_speckle,
134
+ color_precision,
135
+ layer_difference,
136
+ corner_threshold,
137
+ length_threshold,
138
+ max_iterations,
139
+ splice_threshold,
140
+ path_precision
141
+ ],
142
+ outputs=[html,svg_output]
143
+ )
144
+
145
+ # Launch the app
146
+ app.launch(debug=True)