Skip to content

餐饮数据可视化,分析绵阳市餐厅的销量与评价。技术栈:d3+vue。

License

Notifications You must be signed in to change notification settings

huyaocode/restaurant-data-visual

Repository files navigation

针对团购网站餐饮类消费数据的可视分析系统设计与开发

大多数消费者在选择团购网站消费侯后会做出相应评价,从而产生海量的交易数据。这些数据包含了消费者对饮食比较全面的主观性评价和量化评分,因此通过对此类餐饮数据的分析能够有效洞悉城市餐饮消费行为。而由于该类数据体量大、数据类型多等特点,使得传统的数据分析技术已经难以有效进行分析处理。如何将可视分析技术应用于团购网站餐饮类数据分析,探索城市消费行为是一个新颖的研究课题。提供某团购网站绵阳市2015.1.1至2015.11.11期间3623家餐饮类店铺数据的基本信息及30572条评论信息。包含两个数据表:店铺基本信息表和评论属性表。

效果展示

总览

all

地图

绵阳市地图,使用百度地图API绘制地图,主题设置为暗色系,凸显店铺的分布情况。不同种类的店铺用不同的信息标记,来展示不同种类店铺的分布情况。此处使用的视觉通道为颜色,不同的颜色标记不同种类的店铺。 map

地图筛选功能

map

各类型餐厅比例

各类型餐厅比例图,视觉通道采用颜色和面积大小来设置,通过颜色来表示不同类型的餐厅类型,通过颜色区域的面积大小,表现出这类餐厅占整个餐厅的比例。

block

某类型店铺(如川菜)在绵阳的分布

block

某家店词云

词云图展示该店铺所有的评论生成的词云图,词云图中词的大小标出词语出现的频率,频率越高,字体大小越大。

word

绵阳市各类型菜品消费趋势

绵阳市一年各类型的消费趋势图,财通颜色标记不同类型种类的消费,通过折线图表现一年内不同种类的消费每月的订单数目,体现出地区对各种消费比较。

qushi

源数据描述

店铺基本信息表中包含: 店铺id、店铺名称、店铺星级、服务评分、口味评分、环境评分、评论数量、店铺地址、店铺类型等。

评论属性表中包含: 评论id、用户id、店铺id、综合评分、口味评分、环境评分、服务评分、评论内容(构建词云、关键词提取)、评论时间、用户名、用户等级等。

视图与目标

【地图】 点的大小表示店的综合评价(根据评论数和评分定)

【绵阳各月份消费情况】折线图:餐饮类别为折线条数,x为月份,y为消费数

【针对餐饮类别的区域分布】格格图:分两层,第一层为:餐饮类别,第二层为:区域所占比例

【针对单个区域的餐饮类别】堆叠条形图,y:区域

【单个店铺的运营情况】 柱状图, y值为评论数、颜色随着评论等级变化

【店铺评论词云展示】对评论进行分词然后展示词云

部分文档(详细文档参考组件文件夹中README)

使用reset.css重置默认样式

因各浏览器的默认样式有一些细节上的差别,这里引用reset.css重置默认css,让项目再各浏览器上表现一致。 使用方法: 再src/assets/styles文件夹下存放reset.css 再src/main.js中使用

vue-cli3搭建的项目中代理接口名

为了方便前端开发者能够模拟向后台发送数据,在public文件夹下添加 mock文件夹,存放mock数据。然后将所有访问api路径的请求转发到mock文件夹下。 vue-cli 3.+版本,安装完成之后也找不到config、build等目录。查看官方文档,发现已经被简化成使用vue.config.js来配置项目,可以使用了webpack-chain链式API的调用方式,简化了对webpack配置的修改。

数据整理(清洗)

为了让前端使用方便,不需要在页面打开时进行一次数据整理过程。鉴于本课题的数据是固定的,所以将数据整理后再发给前台。 在mock文件夹中创建reorganizeData文件夹,他将处理mock文件夹中的原始数据item.json(餐厅数据) 与 useritem.json(用户评论数据) 在mock/reorganizeData 中 handeldata.js 文件将对数据进行第一次整理。

对餐厅评论数据的处理

源数据格式:(item.json)

{
    "item_id":"10535374",
    "name":"廊桥会所",
    "star":3.0,
    "cost":0.0,
    "tast":7.3,
    "environment":7.3,
    "service":7.3,
    "review_count":"2 条点评",
    "item_pic":null,
    "item_info":"咖啡厅 | 御营坝 滨河南路东段14号",
    "item_key_word":null
}

处理后数据:(res) 将所有的评论分类, 对象的键名为餐厅id。 在对象中包括各分值的平均分;在details数组中包含了每一条评论的具体评分与时间;review中为所有评论拼接而成的字符串。因为没有好用的npm分词包,我使用python的jieba库来对评论数据进行处理。

"2067427": {                //餐厅id
    "avg_rating": 37,       //综合评分平均值
    "avg_tast": 2.5,        //口味评分平均值
    "avg_environment": 2.3, //环境评分平均值
    "avg_service": 2.5,     //服务评分
    "review": "团购点评 很实惠 环境也不错 下次还会来的 团购点评 还行!比较适合两个人聊天,比较安静 还行吧,算绵阳比较好的,我确实不怎么喜欢。环境还蛮好,牛排真........",
    "details": [
      {
        "times": "07-23",
        "rating": 50,
        "tast": 4,
        "environment": 4,
        "service": 4
      },
      //................
    // 评论细节
    ]
  },

About

餐饮数据可视化,分析绵阳市餐厅的销量与评价。技术栈:d3+vue。

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published