0

This question is not a duplicate because I have stored the image address in a dataset and i need to retrieve those images that are present in my folder using a machine learning model, store it in a list and display those images in a browser I am creating a movie recommendation system in flask. I need to display poster image along with the name, but the browser doesn't seem to view the image. Here is my code:

app.py:

from flask import Flask,render_template
from flask import request
from sample import get_title_from_index
from sample import get_poster_from_index
from sample import similar_movies
from flask import jsonify
from PIL import Image
import array as arr

app = Flask(__name__)

@app.route('/', methods=['GET','POST'])
def predict():
    if 'movie_input' in request.form:
        movies = similar_movies(request.form['movie_input'])
        i=0
        print("Top 5 similar movies are:")
        e1= []
        p1=[]
        for element in movies:
            e1.insert(0,get_title_from_index(element[0]))
            image= Image.open(get_poster_from_index(element[0]))
            p1.insert(0,image)

            i=i+1
            if i>5:
               break
    else:
        e1 = "No movies selected. Please, select something!"
        p1 = ""

    return render_template('predictor.html', movie=e1,poster=p1)


if __name__ == '__main__':
    app.run(debug=True)

predictor.html:

<!doctype html>
<html>
<head>
</head>
<body>
<form method="POST">
<input type="text" name="movie_input" maxlength="500" >
<input type="submit" value="Submit" method="get" >

</form>
<p>
{{movie[0]}}
{{poster[0]}}

</p>

</body>
</html>

sample.py

import pandas as pd
import numpy as np

from sklearn.feature_extraction.text import CountVectorizer
from sklearn.metrics.pairwise import cosine_similarity
df = pd.read_csv("movies.csv")


def get_title_from_index(index):
    return df[df.index == index]["title"].values[0]
def get_index_from_title(title):
    return df[df.title == title]["index"].values[0]
def get_poster_from_index(index):
    return df[df.index == index]["poster"].values[0]

def combine_features(row):
        return row["keywords"]+"" +row["cast"]+""+row["genres"]+""+row["director"]
def similar_movies(movie_input):
    features = ['keywords','cast','genres','director']
    df["poster"] = df["poster"].fillna("")
    for feature in features:
        df[feature] = df[feature].fillna("") #filling all NaNs with blank string
    df["combined_features"] = df.apply(combine_features,axis=1)
    cv = CountVectorizer() #creating new CountVectorizer() object
    count_matrix = cv.fit_transform(df["combined_features"])
    cosine_sim = cosine_similarity(count_matrix)
    movie_index = get_index_from_title(movie_input)
    similar_movies = list(enumerate(cosine_sim[movie_index])) 
    sorted_similar_movies = sorted(similar_movies,key=lambda x:x[1],reverse=True)[1:]

    return sorted_similar_movies

The browser view:

browser view

The browser view shows that the image is present but doesn't seems to view it.

dataset view movie dataset view

folder view flask folder

Please review my code and let me know the necessary changes.

  • Please include any data in your post itself, not as a picture. What attempts have you made to resolve this? – AMC Nov 24 '19 at 07:46

1 Answers1

0

You can't just output an image file into html. You have you have encode it an put it in an html IMG tag.

If you encode the image data into base64, you can do something like:

{{movie[0]}}
<img src="data:image/png;base64, {{poster[0]}}" />

For encoding the image, see Encoding an image file with base64

minboost
  • 2,555
  • 1
  • 15
  • 15