передача координат в d3js со стороны сервера asp.net с нулевым значением - PullRequest
Новая
       90

передача координат в d3js со стороны сервера asp.net с нулевым значением

0 голосов
/ 22 сентября 2019

Я работаю над визуализацией данных на карте, используя d3js.Я был в состоянии показать карту, которая, если я поставлю статические координаты, она покажет маркер на карте.но я хочу получить координаты из базы данных и показать маркер на карте, хотя передача координат со стороны сервера в d3js - вот где у меня возникают проблемы.Я прошел через некоторые вопросы, связанные с этим, которые действительно помогли мне до сих пор, но я застрял здесь, поскольку метод, переданный d3js, показывает нулевое значение. 

    var width = window.innerWidth,
                height = window.innerHeight;

            // create svg for viz
            var svg = d3.select("body")
                .append("svg")
                .attr("width", width)
                .attr("height", height);

            // define JSON map data
            d3.json("NGA_adm2_conv.json", function (json) {
                // create a first guess for the projection
                var center = d3.geo.centroid(json);
                var scale = 3000; //150;//8000;
                var offset = [width / 2, height / 2];

                var projection = d3.geo.mercator()
                    .center(center)
                   // .rotate([85.8, 0])
                    .scale(scale)
                    .translate(offset);

                var geoPath = d3.geo.path()
                    .projection(projection);

                svg.append("g")
                    .selectAll("path")
                    .data(json.geometries)
                    .enter()
                    .append("path")
                    .attr("d", geoPath)   
                    .attr("class", "areas")
                    .attr("fill", "Steelblue");
                // Create data for circles:

               //passing method to var marker then to d3
                var markers = '<%= JasonGet() %>';
                // Add circles:
                svg
                  .selectAll("myCircles")
                  .data(markers)
                  .enter()
                  .append("circle")
                    .attr("cx", function (d) { return projection([d.longitude, d.latitude])[0] })
                    .attr("cy", function (d) { return projection([d.longitude, d.latitude])[1] })
                    .attr("r", 4)
                    .style("fill", "69b3a2")
                    .attr("stroke", "#69b3a2")
                    .attr("stroke-width", 2)
                    .attr("fill-opacity", .4)

            });


//below is my asp.net c# code for fetching coordinates from database 

    public string jsonString = "";
            [WebMethod]
            public string JasonGet()
            {
                var queryWithForJson = "SELECT  latitude, longitude FROM tblCoordinates FOR JSON AUTO";
                var conn = new SqlConnection(connetionString);
                var cmd = new SqlCommand(queryWithForJson, conn);
                conn.Open();
                var jsonResult = new StringBuilder();
                var reader = cmd.ExecuteReader();
                if (!reader.HasRows)
                {
                    jsonResult.Append("[]");
                }
                else
                {
                    while (reader.Read())
                    {
                        jsonResult.Append(reader.GetValue(0).ToString());
                    }
                }
                Label1.Text = jsonResult.ToString();
               return (new JavaScriptSerializer()).Serialize(jsonResult);
            }
...