score:1

Accepted answer

You will definitely need to use css to style the tweets. Also one should not mix svg and html elements eg. append 'g' to a 'div'. Finally in d3 you can (and should) bind data to selections instead of looping manually.
What you want is something like this:

var tweetDivs = d3.select(".panel").selectAll('div.panel-body')
            .data(tweet_list)
            .enter()
            .append("div")
            .attr("id", function(d){return "p"+d['id_str'];})
            .classed("panel-body", true);


          tweetDivs.append("img")
            .attr("width", 20)
            .attr("height", 20)
            .attr("src", function(d){return d['user']['profile_image_url']})
            .attr('style', 'display: inline-block;')

          tweetDivs.append("p")
            .text(function(d){

                return "@"+d['user']['screen_name'];//+"    ("+tweet_created_format+")";
            })              
            .attr('style', 'display: inline-block;')

        tweetDivs.append("p")
            .text(function(d){
                return d['text'];
            })


        tweetDivs.append("img")
            .attr("src", "{{ url_for('static', filename = 'img/twitter-like.svg') }}");
        tweetDivs.append("img")
            .attr("src", "{{ url_for('static', filename = 'img/twitter-retweet.svg') }}");

        tweetDivs.append("p")
            .text(function(d){
                return d['retweet_count'];
            });
        tweetDivs.append("p")
            .text(function(d){
                return d['favorite_count'];
            });

EDIT: Fixed invisible reference to html and svg tags.


Related Query

More Query from same tag