python flask后台通过render_template传dataframe的GPS数据到javascript

    最近做python flask编程，遇到要将后台python文件里产生的dataframe数据传到javascript中一直传不成功的问题，试了各种方法，都没传成功，由于初学，就想用点通俗易懂的方法，最后自己设计了一个很笨的在javascript中分割字符串的方法，通俗易懂。^-^

    我要传的data_new_tohtml是dataframe数据，通过使用python文件中的代码

return render_template('display.html', data_new_map=json.dumps(data_new_tohtml.to_dict('records')))

    向javascript传递数据，着实很简单，但是在javascript中取数据的时候就遇到问题了，使用

var  js_object = eval('{{data_new_map|tojson|safe}}');

     一直取不出来，不能得到js对象，不过通过如下命令可以得到dataframe数据转换成的字符串

var js_gpsdate = '{{data_new_map|tojson|safe}}';

      所以再通过js_gpsdate.split()进行各种字符串分割，得到自己想要的数据。

      贴主要代码：

     1、 python后台代码：

import pandas as pd
import json
from flask import Flask, render_template

app = Flask(__name__)

@app.route('/')
def index():
    data_new_tohtml=pd.DataFrame(
            data={
                    'longitude':[114.513,114.513,114.513,114.51303],
                    'latitude':[33.026,33.02676,33.026,33.027229]
                    })#测试数据，乱写的数据
    data_new_tohtml = data_new_tohtml[['longitude','latitude']]
    return render_template('display.html', data_new_map=json.dumps(data_new_tohtml.to_dict('records')))

      2、javascript代码：

<script type="text/javascript">
    var js_gpsdata_new = '{{data_new_map|tojson|safe}}';
    console.log(js_gpsdata_new);
    //通过字符串分割的方法取出字符串中的GPS数据
    var strs1= new Array(); //定义一数组
    var strs2= new Array(); //定义一数组 
    var strs3= new Array(); //定义一数组 
    var strs4= new Array(); //定义一数组
    var gpslonglat= new Array(); //存储GPS数组
    var gpslong= new Array(); //存储GPS数组
    var gpslat= new Array(); //存储GPS数组
    var numlong = 0;
    strs1=js_gpsdata_new.split("}, {"); //字符分割 
    for (i=0;i<strs1.length ;i++ ){
      strs2=strs1[i].split(", "); //字符分割
      for (j=0;j<strs2.length ;j++ ){
        strs3=strs2[j].split(": "); //字符分割
        if (i == strs1.length-1){
          strs4=strs3[1].split("}"); //字符分割
          gpslonglat[numlong] = parseFloat(strs4[0]);
        }else{
          gpslonglat[numlong] = parseFloat(strs3[1]);
        }
        numlong = numlong + 1;
      }
    }
    var numlo = 0;
    var numla = 0;
    for (k=0;k<gpslonglat.length ;k++ ){
      if (k%2 ==0){
        gpslong[numlo] = gpslonglat[k];
        numlo = numlo + 1;
      }
      else{
        gpslat[numla] = gpslonglat[k];
        numla = numla + 1;
      }
    }
    console.log(gpslong[0]);
    console.log(gpslat[0]);
</script>

完毕！本文为编程过程中的方法记录，不是最优方法，实在走不通的时候可参考本文方法。

参考博客：https://www.cnblogs.com/lazyboy1/p/5015111.html