<!doctype html>
<html>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<meta name="format-detection" content="telephone=no,email=no" />
<meta name="apple-touch-fullscreen" content="yes" >
<meta name="App-Config" content="fullscreen=yes,useHistoryState=yes,transition=yes">
<!-- uc强制竖屏 -->
<meta name="screen-orientation" content="portrait">
<!-- QQ强制竖屏 -->
<meta name="x5-orientation" content="portrait">
<!-- UC强制全屏 -->
<meta name="full-screen" content="yes">
<!-- QQ强制全屏 -->
<meta name="x5-fullscreen" content="true">
<!-- UC应用模式 -->
<meta name="browsermode" content="application">
{{--<meta name="csrf-token" content="{{ csrf_token() }}" />--}}
<title>宁夏广播电视台新闻客户端</title>
<head>
	<style type="text/css">
		*{margin:0;padding:0;}
		html,body{
				width:100%;
				/*height:100%*/

		}
		body{
			  font-family: "华文细黑";
			  background:url({{URL::asset('images/five_bj.png')}}) no-repeat;
			  background-size: cover;

		}
	</style>
</head>
<body>
<div id="main" style="margin:0 auto;width:100%;height:650px;"></div> {{--margin:-10px auto auto auto;"--}}
<script type="text/JavaScript" src="{{URL::asset('js/echarts.min.js')}}"></script>
<script type="text/JavaScript" src="{{URL::asset('js/ningxia.js')}}"></script>
<script type="text/javascript">
    var he = document.body.clientHeight;
    var oDiv=document.getElementById('main');
    oDiv.style.height=he-40-49-40+'px';
var dom = document.getElementById("main");
var myChart = echarts.init(dom);
var chart = echarts.init(document.getElementById('main'));
chart.setOption({
	series: [{
		type: 'map',
		//selectedMode : 'single',
		map: '宁夏',
		itemStyle:{  
			normal:{
				label:{show:true},
				borderColor: 'blue',
                areaColor: '#ffffff',
			},  
			emphasis: {
				areaColor: 'red',
				borderWidth: 1,
				label:{show:true},
			}	
		},
        data:{!! $data !!} ,
	}]
});
function setupWebViewJavascriptBridge(callback) {
    if (window.WebViewJavascriptBridge) {
        callback(WebViewJavascriptBridge)
    } else {
        document.addEventListener('WebViewJavascriptBridgeReady' , function() {
            callback(WebViewJavascriptBridge)
        }, false );
    }
	// =====以下是iOS必须的特殊处理========
    if (window.WVJBCallbacks) { return window.WVJBCallbacks.push(callback); }
    window.WVJBCallbacks = [callback];
    var WVJBIframe = document.createElement('iframe');
    WVJBIframe.style.display = 'none';
    WVJBIframe.src = 'wvjbscheme://__BRIDGE_LOADED__';
    document.documentElement.appendChild(WVJBIframe);
    setTimeout(function() { document.documentElement.removeChild(WVJBIframe) }, 0);
	// =====以上是iOS必须的特殊处理========
}
myChart.on('click', function(params){
    //console.log("OC中返回的参数:", params)
	//alert(params.data.id);
    // 注意：abc是html跟iOS和安卓定义好的一个名字，后面的{}里面是传过去的参数,用这个上面必须得引用header的一堆关于webviewjavascript的js
    setupWebViewJavascriptBridge(function(bridge) {
        bridge.callHandler('interactive', {'id':params.data.id}, function responseCallback(responseData) {
            console.log("OC中返回的参数:", responseData)
        });
    })
});
</script>
</body>
</html>