Black Lives Matter. Please consider donating to Black Girls Code today.
Dash HoloViews is now available! Check out the docs.

Using Dash upload component to upload txt file and generating plots

I have created a Dash application that reads a txt file, formats the data in the txt file and creates a DF for generating plots. So far I was working with my local txt files by directly passing the file path in my code.

What I want is to take files uploaded by other users and generate plots based on their data.

I came to know about the dash upload component but I am not sure how to use it here.
How can I use the dcc upload for parsing a uploaded file to generate plots?

Also I want to make it a multi-page Dash app where I am asking the user to upload the file on the homepage so if I use dcc upload is it possible to parse my file to my other page where plots are generated?

This is how I am currently reading my local files and cleaning the data to create a DF:

parsedData = [] # List to keep track of data so it can be used by a Pandas dataframe
conversationPath = "filename.txt"
with open(conversationPath, encoding="utf-8") as fp:
    fp.readline() # Skipping first line of the file (usually contains information unnecesarry info)
        
    messageBuffer = [] # Buffer to capture intermediate output for multi-line messages
    date, time, author = None, None, None # Intermediate variables to keep track of the current message being processed
    
    while True:
        line = fp.readline() 
        if not line: # Stop reading further if end of file has been reached
            break
        line = line.strip() # Guarding against leading and trailing whitespaces
        if startsWithDate(line): # If a line starts with a Date Time pattern, then this indicates the beginning of a new message
            if len(messageBuffer) > 0: # Check if the message buffer contains characters from previous iterations
                parsedData.append([date, time, author, ' '.join(messageBuffer)]) # Save the tokens from the previous message in parsedData
            messageBuffer.clear() # Clear the message buffer so that it can be used for the next message
            date, time, author, message = getDataPoint(line) # Identify and extract tokens from the line
            messageBuffer.append(message) # Append message to buffer
        else:
            messageBuffer.append(line) # If a line doesn't start with a Date Time pattern, then it is part of a multi-line message. So, just append to buffer

df = pd.DataFrame(parsedData, columns=['Date', 'Time', 'Name', 'Message'])

Hi @atharvakatre,
Dash Upload component doesn’t read your file directly after it is uploaded, it saves as bs64 encoded string and then you have to decode this string and read it using reader.
For example,
User uploaded txt file, the Dash app will access the content of the file in base64 encoded string in content property of dcc.Upload component and then we will decode it like

content_type, content_string = contents.split(',')
decoded = base64.b64decode(content_string)

and then read the decoded file using

pd.read_csv(io.StringIO(decoded.decode('utf-8')), sep = '\t') 

For more detailed explanation, look here

1 Like