Trying to present a map using heavy ai charting

Follow

Ashwani Dangwal

• October 14, 2022 11:56

While trying to show a map in a web page while using the vega rendering engine i got the following error in the console- Uncaught ReferenceError: MapdCon is not defined at HTMLDocument.init The source code is taken from - https://docs.heavy.ai/v/6.0.0/apis-and-interfaces/vega/vega-tutorials/tutorial-vega-at-a-glance Please refer to the index.html file and when we instantiate the MapdCon object for connecting to the backend its not working. The github reference used are - https://github.com/heavyai/heavyai-charting

0

• 

  Candido Dessanti

  • October 17, 2022 12:21

  Hi @Ashwani,

  hjave you tried using the API DBCon instead MapdCon?

  probelbly the docs are out of date, because the various rebranding we did in the latest years

  https://docs.heavy.ai/v/6.0.0/apis-and-interfaces/vega/vega-tutorials/tutorial-vega-at-a-glance#connecting-to-the-server-and-rendering-the-visualization

  if I look to the https://raw.githubusercontent.com/heavyai/heavyai-connector/master/dist/browser-connector.js Into the code I cannot see any MpadCON, but only a DBCon method

  0

  Comment actions Permalink
• 

  Ashwani Dangwal

  • October 17, 2022 12:38

  Hey, Thanks for the reply, I cleared that error and now I can visualize the charts in my local server but how do I customize it according to the geographical location. For example, if I want the maps to be shown of just India then where and what adjustments do I have to make in the code (probably in the scales and marks).

  

  0

  Comment actions Permalink
• 

  Candido Dessanti

  • October 18, 2022 19:48

  Hi,

  I'm not sure about that but it should be the scales, to create a bounding box where the geometries are rendered.

  Have you tried? I can ask internally

  Regards, Candido

  0

  Comment actions Permalink
• 

  Ashwani Dangwal

  • October 20, 2022 07:41

  Tried but not working still, can you please ask internally?

  

  0

  Comment actions Permalink
• 

  Candido Dessanti

  • October 20, 2022 14:46

  hi @Ashwani ,

  do you want to render a map with an arbitrary bounding box?

  looking at the vega examples it's something like this. if you filter the points on your data applying the same to the scale you should create a bounding box.

  In this case i used the BBox for florida

  {
    "width": $width,
    "height": $height,
    "data": [
      {
        "name": "fec_contributions_oct",
        "sql": "SELECT conv_4326_900913_x(lon) as x, conv_4326_900913_y(lat) as y, recipient_party as dim0, amount as val, rowid FROM fec_contributions_oct WHERE conv_4326_900913_x(lon) between -9755476.673860101 and -8909050.465332145 and conv_4326_900913_y(lat) between -8909050.465332145 and 3632864.467625127 LIMIT 2000000"
      }
    ],
    "scales": [
      {
        "name": "x",
        "type": "linear",
        "domain": [ -9755476.673860101, -8909050.465332145 ],
        "range": "width"
      },
      {
        "name": "y",
        "type": "linear",
        "domain": [ 2817280.425330668, 3632864.467625127 ],
        "range": "height"
      }
    ],
    "marks": [
      {
        "type": "symbol",
        "from": { "data": "fec_contributions_oct" },
        "properties": {
          "width": 10,
          "height": 10,
          "x": { "scale": "x", "field": "x" },
          "y": { "scale": "y", "field": "y" },
          "fillColor": "deepskyblue",
          "strokeColor": "rgb(0, 0, 0)",
          "strokeWidth": 1.5,
          "shape": "circle"
        }
      }
    ]
  }
  

  0

  Comment actions Permalink
• 

  Ande

  • November 14, 2022 10:54

  [quote="candido.dessanti, post:2, topic:3069"] if I look to the https://raw.githubusercontent.com/heavyai/heavyai-connector/master/dist/browser-connector.js . Into the code I cannot see any MpadCON, but only a DBCon method [/quote]

  Thank you for the link. That worked for me!

  0

  Comment actions Permalink
• 

  Candido Dessanti

  • November 14, 2022 11:34

  Hi @kolay,

  Thanks for joining the community ;)

  I think this connection issue looks resolved for everyone, so we have just to update our docs with he new method names.

  Have you tried to render a Vega Map?

  Candido

  0

  Comment actions Permalink

Please sign in to leave a comment.