Update app.py

app.py

@@ -71,31 +71,18 @@ def find_fastest_route(G, start_node, end_node, weight='travel_time'):
         return None, None
 
 def plot_route_on_map(G, route, start_point, end_point):
-    """Отрисовывает один маршрут на стильной и минималистичной карте Folium."""
-    # Используем минималистичные тайлы 'CartoDB positron' для чистого вида
+    """Отрисовывает один маршрут на стильной карте, как в скриншоте."""
     m = folium.Map(tiles="CartoDB positron", attr='&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors &copy; <a href="https://carto.com/attributions">CARTO</a>')
 
     if route:
         points = [(G.nodes[node]['y'], G.nodes[node]['x']) for node in route]
-        
-        # Белая "подложка" для контраста и лучшей видимости
-        folium.PolyLine(points, color="white", weight=10, opacity=0.8).add_to(m)
-        # Основная линия маршрута - яркий, приятный синий цвет
-        main_line = folium.PolyLine(points, color="#007FFF", weight=5, opacity=1, tooltip="Оптимальный маршрут")
+        main_line = folium.PolyLine(points, color="#007FFF", weight=5, opacity=0.9)
         main_line.add_to(m)
-
-        # Автоматическая настройка масштаба карты под маршрут
         m.fit_bounds(main_line.get_bounds(), padding=(30, 30))
 
-    # Стильные маркеры для старта и финиша
-    folium.Marker(
-        location=start_point, popup="<b>Старт</b>",
-        icon=folium.Icon(color="green", icon="play", prefix='fa')
-    ).add_to(m)
-    folium.Marker(
-        location=end_point, popup="<b>Финиш</b>",
-        icon=folium.Icon(color="red", icon="flag-checkered", prefix='fa')
-    ).add_to(m)
+    # Маркеры, как в скриншоте: красный - старт, зеленый - финиш
+    folium.Marker(location=start_point, popup="<b>Старт</b>", icon=folium.Icon(color="red")).add_to(m)
+    folium.Marker(location=end_point, popup="<b>Финиш</b>", icon=folium.Icon(color="green")).add_to(m)
 
     return m
 
@@ -106,7 +93,7 @@ print("✅ Вспомогательные функции готовы.")
 # ==============================================================================
 print("\n🚀 Шаг 5: Настройка и запуск веб-интерфейса Gradio...")
 
-geolocator = Nominatim(user_agent="bishkek_navigator_app_v3")
+geolocator = Nominatim(user_agent="bishkek_navigator_app_v4")
 geocode = RateLimiter(geolocator.geocode, min_delay_seconds=1)
 
 def find_and_plot_route_by_address(start_address, end_address, day_of_week, hour, minute):
@@ -125,66 +112,78 @@ def find_and_plot_route_by_address(start_address, end_address, day_of_week, hour
         start_node = ox.nearest_nodes(G, Y=start_point[0], X=start_point[1])
         end_node = ox.nearest_nodes(G, Y=end_point[0], X=end_point[1])
         
-        # Устанавливаем веса ребер графа на основе прогноза модели
         selected_time = datetime.datetime(2023, 1, 2 + day_of_week, int(hour), int(minute))
         travel_times = predict_graph_weights(gdf_edges, model, selected_time)
         nx.set_edge_attributes(G, values=pd.Series(travel_times, index=gdf_edges.index).to_dict(), name='travel_time')
         
-        # Ищем единственный лучший маршрут
         route, travel_time = find_fastest_route(G, start_node, end_node, weight='travel_time')
         if route is None:
             return None, "### ❌ Ошибка\nНе удалось построить маршрут. Возможно, точки находятся в несвязанных частях города."
         
-        # Расчет итоговых параметров маршрута
         SIGNAL_DELAY_SECONDS = 30
         signals_on_route = sum(1 for node in route if node in signal_nodes_set)
         total_time_sec = travel_time + signals_on_route * SIGNAL_DELAY_SECONDS
         total_time_min = total_time_sec / 60
         distance_km = sum(G[u][v][0]['length'] for u, v in zip(route[:-1], route[1:])) / 1000
         
-        # Создание карты
         final_map = plot_route_on_map(G, route, start_point, end_point)
         
-        # Форматирование вывода в Markdown
+        # Форматирование вывода в Markdown, как на скриншоте
         output_md = f"""
-        ### ✅ Маршрут построен!
-        - **Время в пути:** <span style="font-size: 1.1em; color: #007FFF;">**~{total_time_min:.1f} мин.**</span>
-        - **Расстояние:** **{distance_km:.2f} км**
-        - **Светофоров на пути:** **{signals_on_route}**
+        **✅ Маршрут построен!**
+
+        *   Время в пут��: ~{total_time_min:.1f} мин.
+        *   Расстояние: {distance_km:.2f} км
+        *   Светофоров на пути: {signals_on_route}
         """
-        return final_map._repr_html_(), output_md
+        return final_map._repr_html_(), output_md.replace("    *", "*") # Убираем лишние отступы для Markdown
         
     except Exception as e:
         return None, f"### 💥 Произошла внутренняя ошибка:\n`{e}`"
 
-# CSS для стилизации интерфейса
+# CSS для стилизации интерфейса под дизайн со скриншота
 css = """
-body { font-family: 'Inter', sans-serif; background-color: #f7fafc; }
-.gradio-container { max-width: 1200px !important; margin: auto !important; padding-top: 2rem; }
-#map-output div { border-radius: 1rem; overflow: hidden; box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); }
+body, .gradio-container { background-color: #f0fdfa; font-family: 'Inter', sans-serif; }
+.gradio-container { max-width: 1200px !important; margin: auto !important; padding-top: 1.5rem; }
+/* Стили для карты */
+#map-output { border-radius: 1.5rem; overflow: hidden; box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); }
+/* Стили для кнопки */
 .gr-button-primary { 
-    background: linear-gradient(to right, #43e97b 0%, #38f9d7 100%);
-    color: #1a202c; font-weight: bold; border: none; transition: all 0.3s ease; box-shadow: 0 4px 6px rgba(0,0,0,0.1);
+    background-color: #14b8a6; color: white; font-weight: bold; border-radius: 0.75rem; border: none;
+    box-shadow: 0 4px 6px rgba(20, 184, 166, 0.2); transition: all 0.2s ease; padding: 12px 0;
+}
+.gr-button-primary:hover { background-color: #0d9488; box-shadow: 0 7px 10px rgba(20, 184, 166, 0.3); transform: translateY(-2px); }
+/* Стили для информационного блока с результатом */
+#info-box { background-color: white; padding: 1.5rem !important; border-radius: 1rem; box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -1px rgba(0,0,0,0.06); }
+/* Стили для меток (Откуда?, Куда?, и т.д.) */
+.gradio-container .form .gr-label span {
+    background-color: #ccfbf1; color: #134e4a; padding: 5px 12px;
+    border-radius: 9999px; font-size: 0.8em; font-weight: 600;
+    display: inline-block; margin-bottom: 6px;
+}
+/* Стили для полей ввода */
+.gradio-container .gr-input-text, .gradio-container .gr-dropdown {
+    border-radius: 0.75rem !important; border-color: #cbd5e1 !important;
+}
+.gradio-container .gr-input-text:focus, .gradio-container .gr-dropdown:focus {
+    border-color: #14b8a6 !important; box-shadow: 0 0 0 2px rgba(20, 184, 166, 0.3) !important;
 }
-.gr-button-primary:hover { box-shadow: 0 7px 14px rgba(67, 233, 123, 0.3); transform: translateY(-2px); }
-#info-box { background-color: white; padding: 1.5rem !important; border-radius: 1rem; box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06); }
 """
 
-with gr.Blocks(theme=gr.themes.Soft(primary_hue="teal", secondary_hue="gray"), css=css) as demo:
+with gr.Blocks(theme=gr.themes.Soft(primary_hue="teal", secondary_hue="gray", font=gr.themes.GoogleFont("Inter")), css=css) as demo:
     gr.Markdown(
         """
-        <div style="text-align: center;">
-            <h1 style="font-size: 2.5rem; font-weight: 700;">🗺️ Умный навигатор по Бишкеку</h1>
-            <p style="color: #4A5568; font-size: 1.1rem;">Постройте оптимальный маршрут с учётом прогноза пробок</p>
+        <div style="text-align: center; margin-bottom: 2rem;">
+            <h1 style="font-size: 2.5rem; font-weight: 700; color: #0f766e;">🗺️ Умный навигатор по Бишкеку</h1>
+            <p style="color: #0d9488; font-size: 1.1rem;">Постройте оптимальный маршрут с учётом прогноза пробок</p>
         </div>
         """
     )
     with gr.Row(equal_height=False):
         with gr.Column(scale=1):
-            # ИСПРАВЛЕНИЕ: gr.Box() заменен на gr.Group() для совместимости
             with gr.Group():
-                start_address_input = gr.Textbox(label="Откуда?", placeholder="Например, ЦУМ")
-                end_address_input = gr.Textbox(label="Куда?", placeholder="Например, парк Ата-Тюрк")
+                start_address_input = gr.Textbox(label="Откуда?", placeholder="7 микрорайон")
+                end_address_input = gr.Textbox(label="Куда?", placeholder="Ошский рынок")
                 
                 with gr.Accordion("🗓️ Указать время и дату", open=False):
                     day_dropdown = gr.Dropdown(label="День недели", choices=["Понедельник", "Вторник", "Среда", "Четверг", "Пятница", "Суббота", "Воскресенье"], value="Понедельник", type="index")