厦门房价地图可视化

厦门房价地图可视化

基于链家数据,结合百度地图进行厦门房价可视化:

厦门房价地图可视化_第1张图片


<html style="height: 100%">

<head>
    <meta charset="utf-8">
    <title>厦门房价title>
head>
<style type="text/css">
    -- a:link {
        color: #ffffff;
    }

    a:visited {
        color: #B0B0B0;
    }

    a:active {
        color: #ff0000;
    }

    -->
style>

<body style="height: 100%; margin: 0">
    <div id="container" style="height: 100%">div>
    <script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts/echarts-all-3.js">script>
    <script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts/extension/dataTool.min.js">script>
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=ZUONbpqGBsYGXNIYHicvbAbM">script>
    <script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts/extension/bmap.min.js">script>
    <script type="text/javascript" src=.\\js\\house_price.js>script>
    <script type="text/javascript">
        var dom = document.getElementById("container");
        var myChart = echarts.init(dom);
        var app = {};
        option = null;
        app.title = '散点图与百度地图扩展';

        myChart.setOption(option = {
            animation: false,
            bmap: {
                center: [118.088441, 24.511069],
                zoom: 13,
                roam: true
            },
            tooltip: {
                enterable: true,
                trigger: 'item',
                hideDelay: 1000,                /* alwaysShowContent: true, */
                formatter: function (obj) {
                    var value = obj.value;
                    var str = ''
                    for (i = 0; i < value[4].length; i++) {
                        str += '5][i] + '" target="_blank">' + value[4][i] + '
'
; } return '
' + value[2] + ': ' + value[3] + ' 元/平方米' + '
'
+ str } }, visualMap: { show: true, top: 'top', dimension: 3, min: price_min, max: price_max, calculable: true, inRange: { color: ['yellow', 'red'], symbolSize: [5, 20] } }, series: [ { name: '均价(元/平方米)', type: 'scatter', coordinateSystem: 'bmap', data: points, }, { name: 'Top 10', type: 'effectScatter', coordinateSystem: 'bmap', data: points.slice(0, 10), showEffectOn: 'render', rippleEffect: { brushType: 'stroke' }, hoverAnimation: true, label: { normal: { formatter: function (param) { return param.data[2]; }, position: 'right', show: true }, emphasis: { show: true } }, itemStyle: { normal: { color: '#f4e925', shadowBlur: 10, shadowColor: '#333' } }, zlevel: 1 } ] }); if (!app.inNode) { // 添加百度地图插件 var bmap = myChart.getModel().getComponent('bmap').getBMap(); bmap.addControl(new BMap.MapTypeControl()); }; if (option && typeof option === "object") { myChart.setOption(option, true); } script> body> html>

你可能感兴趣的:(厦门房价)