AJUDA COM JVECTORMAP

 Tópico anterior Próximo tópico Novo tópico

AJUDA COM JVECTORMAP

VB.NET

 Compartilhe  Compartilhe  Compartilhe
#482066 - 02/06/2018 11:29:10

ALEVALE
JUNDIAI
Cadast. em:Março/2012


Pessoal bom dia,

Estou testando o Jvectormap e estou com um problema que ainda não consegui identificar o erro.
Basicamente eu estou gerando os mapas pegando as coordenadas do banco sql, eu já olhei e os parametros gerados pela query do SQL são os mesmos do exemplo do site, mas quando gero pelo SQL ele não está populando o mapa, to achando que pode ser algo com o tipo de retorno do Ajax (contentType)

JAVASCRIT Exemplo (Funcionando)
<script>
    $(document).ready(function () {
        $('#world-map-markers').vectorMap({
            map: 'world_mill',
            scaleColors: ['#C8EEFF', '#0071A4'],
            normalizeFunction: 'polynomial',
            hoverOpacity: 0.7,
            hoverColor: false,

            markerStyle: {
                initial: {
                fill: '#F8E23B',
                stroke: '#383f47'
                }
            },
            backgroundColor: '#383f47',
                markers: [
                    { latLng: [-23.185708, -46.897806], name: 'Cidade 1', style: {r:8, fill: 'red' }},
                    { latLng: [-20.017643, -44.437061], name: 'Cidade 2', style: { fill: 'yellow' }},
                    { latLng: [-26.769785, -48.676757], name: 'Cidade 3' },
                    { latLng: [-34.3375, -56.71361], name: 'San José' },
                    { latLng: [43.93, 12.46], name: 'San Marino' },
                    { latLng: [47.14, 9.52], name: 'Liechtenstein' }
            ]
        });
    });
</script>

ASP.NET
<!-- jvectormap -->
<link href="../plugins/jvectormap/jquery-jvectormap-2.0.3.css" rel="stylesheet" />
<script src="../plugins/jvectormap/jquery-jvectormap-2.0.3.min.js"></script>
<script src="../plugins/jvectormap/jquery-jvectormap-world-merc.js"></script>
<script src="../plugins/jvectormap/jquery-jvectormap-world-mill.js"></script>
<link href="../plugins/jvectormap/jquery-ui-1.8.22.custom.css" rel="stylesheet" />

<%--SCRIPTS--%>
<script>
    $(document).ready(Load_Map());
    event.preventDefault();
</script>

<script type="text/javascript">
    $(function Load_Map() {
        $.ajax({
            type: "POST",
            url: "sites_list.aspx/Sites",
            data: '{}',
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: OnSuccess,
            failure: function (response) {
                alert(response.d);
                },
            error: function (response) {
                alert(response.d);
                }
            });
    });

     function OnSuccess(response) {
         var customers = response.d;
         var LatLng = ""
         $(customers).each(function () {
             LatLng = this.LatLng
             alert(LatLng)
         })
                        
         $('#world-map-markers').vectorMap({
             map: 'world_mill',
             scaleColors: ['#C8EEFF', '#0071A4'],
             normalizeFunction: 'polynomial',
             hoverOpacity: 0.7,
             hoverColor: false,

             markerStyle: {
                 initial: {
                     fill: '#F8E23B',
                     stroke: '#383f47'
                 }
             },
             backgroundColor: '#383f47',
             markers: [LatLng]
         });
      }
</script>

CODE BEHIND
    Public Class Map
        Public Property Site As String
        Public Property Country As String
        Public Property City As String
        Public Property LatLng As String
    End Class

    ''' <summary>
    ''' GENERATE WORLD MAPS
    ''' </summary>
    ''' <returns></returns>
    <System.Web.Services.WebMethod()>
    Public Shared Function Sites()
        Try
            Dim SQL_Connection As SqlConnectionStringBuilder
            SQL_Connection = mdlGeneral.SQL_ConnectionString
            Dim latLng As String = String.Empty

            Dim p As List(Of Map) = New List(Of Map)()
            Using cn As SqlConnection = New SqlConnection(SQL_Connection.ConnectionString)
                Dim myQuery As String = "select OU_sync_site_name,OU_sync_country_name,OU_sync_city,OU_site_latitude,OU_site_longitude,head_quarter FROM site_settings"
                Dim cmd As SqlCommand = New SqlCommand()
                cmd.CommandText = myQuery
                cmd.CommandType = CommandType.Text
                cmd.Connection = cn
                cn.Open()

                Dim dr As SqlDataReader = cmd.ExecuteReader()

                If dr.HasRows Then
                    While dr.Read()
                        Dim cpData As Map = New Map()
                        If Not IsDBNull(dr("OU_site_longitude")) Then
                            latLng = "{latLng: [-23.185708, -46.897806], name: 'Cidade 1', style: {r: 8, fill: 'red' }}"
                        End If
                    End While
                End If
            End Using

            Return p

        Catch ex As Exception

        End Try

    End Function

Veja que no exemplo do site os mapas são populados assim:
Javascritp:{ latLng: [-23.185708, -46.897806], name: 'Cidade 1', style: {r:8, fill: 'red' }},
SQL:{latLng: [-23.185708, -46.897806], name: 'Cidade 1', style: {r: 8, fill: 'red' }}

Eu até forçei na string manualmente para trazer somente 1 site manual para teste mas ele nao popula, eu não identifiquei o erro : (

---------------------------------------------------------------
"Já está provado por A+B que A+B num prova nada"
---------------------------------------------------------------

#482084 - 03/06/2018 12:49:55

ALEVALE
JUNDIAI
Cadast. em:Março/2012


Acho que já identifiquei o problema, a questão é quando estou retornando do banco estou trazendo como string e a string possui as aspas duplas ( " ) no começo e no final.

No exemplo javascript não existem as aspas duplas, apesar de colocar os alerts para debugar e ele traz sem as aspas duplas não funciona, ao mudar o valor do exemplo para  {latLng: [-23.185708, -46.897806], name: 'Cidade 1', style: {r: 8, fill: 'red' }} sem aspas duplas funciona.

Já testei algumas funções para remover as aspas mas não funciona teria que fazer o javascript ignorar elas.

---------------------------------------------------------------
"Já está provado por A+B que A+B num prova nada"
---------------------------------------------------------------

#482103 - 05/06/2018 13:05:25

ALEVALE
JUNDIAI
Cadast. em:Março/2012


Alguém ?

---------------------------------------------------------------
"Já está provado por A+B que A+B num prova nada"
---------------------------------------------------------------

 Tópico anterior Próximo tópico Novo tópico


Tópico encerrado, respostas não sao permitidas
Encerrado por ALEVALE em 24/06/2018 09:59:11