the graph is a 2d representation of the fields which create the shape i requested, plz make it a stunning 3d shape in the form of a 3d skelaton plot on black bg and neon keletaon outlines representing all the weights of all the phrases related to these 2 strings including these 2 strings

import os
from flask import Flask, request, jsonify
from openai import OpenAI
import numpy as np
from sklearn.decomposition import PCA
import matplotlib.pyplot as plt
from mpl_toolkits.mplot3d import Axes3D
import io
import base64

app = Flask(__name__)

client = OpenAI()

def get_embedding(text, model="text-embedding-ada-002"):
    text = text.replace("\n", " ")
    response = client.embeddings.create(input=[text], model=model)
    embedding = response.data[0].embedding
    print(f"Retrieved embedding of length {len(embedding)} for text: '{text}'")  # Debug statement
    return embedding

@app.route('/')
def index():
    html = '''
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>3D Vector Visualizer</title>
        <style>
            body {
                font-family: Arial, sans-serif;
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                height: 100vh;
                background-color: #f8f9fa;
            }
            .container {
                text-align: center;
                margin-top: 50px;
            }
            .input-box {
                margin: 10px;
            }
            #result {
                margin-top: 30px;
            }
        </style>
    </head>
    <body>
    <div class="container">
        <h1>3D Vector Visualizer</h1>
        <div class="input-box">
            <label for="string1">Input String 1:</label>
            <input type="text" id="string1" name="string1">
        </div>
        <div class="input-box">
            <label for="string2">Input String 2:</label>
            <input type="text" id="string2" name="string2">
        </div>
        <button onclick="submitStrings()">Submit</button>
        <div id="result"></div>
    </div>
    
    <script>
        async function submitStrings() {
            const string1 = document.getElementById('string1').value;
            const string2 = document.getElementById('string2').value;
    
            const response = await fetch('/compute', {
                method: 'POST',
                headers: { 'Content-Type': 'application/json' },
                body: JSON.stringify({ string1, string2 })
            });
    
            const result = await response.json();
            if(result.error){
                document.getElementById('result').innerHTML = '<p style="color:red;">' + result.error + '</p>';
                return;
            }
            const img = document.createElement('img');
            img.src = 'data:image/png;base64,' + result.img;
            img.alt = '3D Plot';
            document.getElementById('result').innerHTML = '';
            document.getElementById('result').appendChild(img);
        }
    </script>
    </body>
    </html>
    '''
    return html

@app.route('/compute', methods=['POST'])
def compute():
    data = request.json
    string1 = data.get('string1', '').strip()
    string2 = data.get('string2', '').strip()

    if not string1 or not string2:
        return jsonify({'error': 'Both input strings must be provided.'}), 400

    try:
        # Get embeddings from OpenAI
        embeddings1 = get_embedding(string1)
        embeddings2 = get_embedding(string2)

        # Validate embedding dimensions
        if len(embeddings1) != len(embeddings2):
            return jsonify({'error': 'Embeddings have mismatched dimensions.'}), 500

        combined_embeddings = np.array([embeddings1, embeddings2])
        print(f"Combined embeddings shape: {combined_embeddings.shape}")  # Debug statement

        # Determine the maximum allowed components
        max_components = min(3, combined_embeddings.shape[0], combined_embeddings.shape[1])
        if max_components < 2:
            return jsonify({'error': 'Not enough components for PCA.'}), 500

        print(f"Setting n_components to {max_components}")  # Debug statement

        pca = PCA(n_components=max_components)
        reduced_embeddings = pca.fit_transform(combined_embeddings)
        print(f"Reduced embeddings shape: {reduced_embeddings.shape}")  # Debug statement

        img = plot_3d(reduced_embeddings, [string1, string2])

        return jsonify({'img': img})
    except Exception as e:
        print(f"Error during computation: {e}")  # Debug statement
        return jsonify({'error': str(e)}), 500

def plot_3d(points, labels):
    num_components = points.shape[1]
    fig = plt.figure()
    
    if num_components == 1:
        ax = fig.add_subplot(111)
        ax.scatter(points[:, 0], np.zeros(points.shape[0]), c='r', marker='o')
        for i, label in enumerate(labels):
            ax.text(points[i, 0], 0, '%s' % (label), size=12, zorder=1, color='k')
        ax.set_xlabel('Component 1')
        ax.set_ylabel('Zero')
    elif num_components == 2:
        ax = fig.add_subplot(111)
        xs, ys = points[:, 0], points[:, 1]
        ax.scatter(xs, ys, c='r', marker='o')
        for i, label in enumerate(labels):
            ax.text(xs[i], ys[i], '%s' % (label), size=12, zorder=1, color='k')
        ax.set_xlabel('Component 1')
        ax.set_ylabel('Component 2')
    else:
        ax = fig.add_subplot(111, projection='3d')
        xs, ys, zs = points[:, 0], points[:, 1], points[:, 2]
        ax.scatter(xs, ys, zs, c='r', marker='o')
        for i, label in enumerate(labels):
            ax.text(xs[i], ys[i], zs[i], '%s' % (label), size=12, zorder=1, color='k')
        ax.set_xlabel('Component 1')
        ax.set_ylabel('Component 2')
        ax.set_zlabel('Component 3')
    
    plt.tight_layout()
    img = io.BytesIO()
    plt.savefig(img, format='png')
    plt.close(fig)
    img.seek(0)
    
    plot_url = base64.b64encode(img.getvalue()).decode()
    
    return plot_url

if __name__ == '__main__':
    # Enable debug mode for detailed error messages
    app.run(port=5005, debug=True)